Package Exports

@ueqt/uma

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@ueqt/uma) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Uma

Ueqt's angular material components.

All the components are created using just Angular, Material 2 and CDK.

Check out our documentation & live demo

Components Status

All the components have the prefix uma followed by the package name.

Component	Status	package
Html Tooltip	Available	uma-tooltip
Color Picker	Available	uma-color-picker
Scrollspy	Available	uma-scrollspy
Speed Dial	Available	uma-speed-dial
Timer Picker	Available	uma-timer-picker

If you miss any component, please follow the CONTRIBUTION GUIDELINE to open an issue.

Install

step: 1

We use some components from the Angular Material. To be able to use this component, you have to install the @angular/animations. If you follow all the steps in Material Guide, you already have this step done.

    npm install --save @angular/animations

Note: @angular/animations uses the WebAnimation API that isn't supported by all browsers yet. If you want to support Material component animations in these browsers, you'll have to include a polyfill.

import {BrowserAnimationsModule} from '@angular/platform-browser/animations';

@NgModule({
  ...
  imports: [BrowserAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }

If you don't want to add another dependency to your project, you can use the NoopAnimationsModule.

import {NoopAnimationsModule} from '@angular/platform-browser/animations';

@NgModule({
  ...
  imports: [NoopAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }

step: 2

Install uma package:

    npm install @ueqt/uma

Theming

To use the same theme of Angular Material add the following code to your style.scss.

@import '~@angular/material/theming';
@import '~uma/theming';

@include mat-core();

// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://material.io/design/color/
$demo-primary: mat-palette($mat-green);
$demo-accent: mat-palette($mat-pink, A200, A100, A400);

// The warn palette is optional (defaults to red).
$demo-warn: mat-palette($mat-red);

// Create the theme object (a Sass map containing all of the palettes).
$demo-theme: mat-light-theme($demo-primary, $demo-accent, $demo-warn);

// build angular material theme
@include angular-material-theme($demo-theme);

// pass angular material theme to ueqt's material components
@include uma-theme($demo-theme);

this is only available for the timer-picker component

How to use

For more examples, you can see our app-demo folder or read the full documentation

package

version need change src/lib/package.json

@ueqt/uma