@blox/material
Version:
Material Components for Angular
59 lines • 6.61 kB
JavaScript
import { Directive, ElementRef, HostBinding, Input, Renderer2 } from '@angular/core';
import { asBoolean } from '../../utils/value.utils';
/**
* Directive for elevating an element above its surface.
*/
export class MdcElevationDirective {
constructor(rndr, _elm) {
this.rndr = rndr;
this._elm = _elm;
this._z = null;
this._transition = false;
}
/**
* Input for setting the elevation (z-space). The value sould be in the range [0, 24].
* When set to 0, the element will not be elevated! The default value is 1.
*/
get mdcElevation() {
return this._z == null ? 1 : this._z;
}
set mdcElevation(value) {
let newValue = (value == null || value === '') ? 1 : +value;
if (newValue < 0)
newValue = 0;
if (newValue > 24)
newValue = 24;
if (isNaN(newValue))
newValue = 0;
if (newValue !== this._z) {
if (this._z != null)
this.rndr.removeClass(this._elm.nativeElement, 'mdc-elevation--z' + this._z);
this.rndr.addClass(this._elm.nativeElement, 'mdc-elevation--z' + newValue);
}
this._z = newValue;
}
/**
* When this input is defined and does not have value false, changes of the elevation
* will be animated.
*/
get animateTransition() {
return this._transition;
}
set animateTransition(value) {
this._transition = asBoolean(value);
}
}
MdcElevationDirective.decorators = [
{ type: Directive, args: [{
selector: '[mdcElevation]'
},] }
];
MdcElevationDirective.ctorParameters = () => [
{ type: Renderer2 },
{ type: ElementRef }
];
MdcElevationDirective.propDecorators = {
mdcElevation: [{ type: Input }],
animateTransition: [{ type: HostBinding, args: ['class.mdc-elevation-transition',] }, { type: Input }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWRjLmVsZXZhdGlvbi5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9lbGV2YXRpb24vbWRjLmVsZXZhdGlvbi5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsV0FBVyxFQUFFLEtBQUssRUFBVSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDN0YsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRXBEOztHQUVHO0FBSUgsTUFBTSxPQUFPLHFCQUFxQjtJQUk5QixZQUFvQixJQUFlLEVBQVUsSUFBZ0I7UUFBekMsU0FBSSxHQUFKLElBQUksQ0FBVztRQUFVLFNBQUksR0FBSixJQUFJLENBQVk7UUFIckQsT0FBRSxHQUFrQixJQUFJLENBQUM7UUFDekIsZ0JBQVcsR0FBWSxLQUFLLENBQUM7SUFHckMsQ0FBQztJQUVEOzs7T0FHRztJQUNILElBQWEsWUFBWTtRQUNyQixPQUFPLElBQUksQ0FBQyxFQUFFLElBQUksSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUM7SUFDekMsQ0FBQztJQUVELElBQUksWUFBWSxDQUFDLEtBQWE7UUFDMUIsSUFBSSxRQUFRLEdBQUcsQ0FBQyxLQUFLLElBQUksSUFBSSxJQUFTLEtBQUssS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQztRQUNqRSxJQUFJLFFBQVEsR0FBRyxDQUFDO1lBQ1osUUFBUSxHQUFHLENBQUMsQ0FBQztRQUNqQixJQUFJLFFBQVEsR0FBRyxFQUFFO1lBQ2IsUUFBUSxHQUFHLEVBQUUsQ0FBQztRQUNsQixJQUFJLEtBQUssQ0FBQyxRQUFRLENBQUM7WUFDZixRQUFRLEdBQUcsQ0FBQyxDQUFDO1FBQ2pCLElBQUksUUFBUSxLQUFLLElBQUksQ0FBQyxFQUFFLEVBQUU7WUFDdEIsSUFBSSxJQUFJLENBQUMsRUFBRSxJQUFJLElBQUk7Z0JBQ2YsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUUsa0JBQWtCLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1lBQ2pGLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsYUFBYSxFQUFFLGtCQUFrQixHQUFHLFFBQVEsQ0FBQyxDQUFDO1NBQzlFO1FBQ0QsSUFBSSxDQUFDLEVBQUUsR0FBRyxRQUFRLENBQUM7SUFDdkIsQ0FBQztJQUlEOzs7T0FHRztJQUNILElBQ2EsaUJBQWlCO1FBQzFCLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUM1QixDQUFDO0lBRUQsSUFBSSxpQkFBaUIsQ0FBQyxLQUFjO1FBQ2hDLElBQUksQ0FBQyxXQUFXLEdBQUcsU0FBUyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3hDLENBQUM7OztZQS9DSixTQUFTLFNBQUM7Z0JBQ1AsUUFBUSxFQUFFLGdCQUFnQjthQUM3Qjs7O1lBUjJELFNBQVM7WUFBakQsVUFBVTs7OzJCQW9CekIsS0FBSztnQ0EwQkwsV0FBVyxTQUFDLGdDQUFnQyxjQUM1QyxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBIb3N0QmluZGluZywgSW5wdXQsIE9uSW5pdCwgUmVuZGVyZXIyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IGFzQm9vbGVhbiB9IGZyb20gJy4uLy4uL3V0aWxzL3ZhbHVlLnV0aWxzJztcclxuXHJcbi8qKlxyXG4gKiBEaXJlY3RpdmUgZm9yIGVsZXZhdGluZyBhbiBlbGVtZW50IGFib3ZlIGl0cyBzdXJmYWNlLlxyXG4gKi9cclxuQERpcmVjdGl2ZSh7XHJcbiAgICBzZWxlY3RvcjogJ1ttZGNFbGV2YXRpb25dJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgTWRjRWxldmF0aW9uRGlyZWN0aXZlIHtcclxuICAgIHByaXZhdGUgX3o6IG51bWJlciB8IG51bGwgPSBudWxsO1xyXG4gICAgcHJpdmF0ZSBfdHJhbnNpdGlvbjogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgcm5kcjogUmVuZGVyZXIyLCBwcml2YXRlIF9lbG06IEVsZW1lbnRSZWYpIHtcclxuICAgIH1cclxuICAgIFxyXG4gICAgLyoqXHJcbiAgICAgKiBJbnB1dCBmb3Igc2V0dGluZyB0aGUgZWxldmF0aW9uICh6LXNwYWNlKS4gVGhlIHZhbHVlIHNvdWxkIGJlIGluIHRoZSByYW5nZSBbMCwgMjRdLlxyXG4gICAgICogV2hlbiBzZXQgdG8gMCwgdGhlIGVsZW1lbnQgd2lsbCBub3QgYmUgZWxldmF0ZWQhIFRoZSBkZWZhdWx0IHZhbHVlIGlzIDEuXHJcbiAgICAgKi9cclxuICAgIEBJbnB1dCgpIGdldCBtZGNFbGV2YXRpb24oKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMuX3ogPT0gbnVsbCA/IDEgOiB0aGlzLl96O1xyXG4gICAgfVxyXG5cclxuICAgIHNldCBtZGNFbGV2YXRpb24odmFsdWU6IG51bWJlcikge1xyXG4gICAgICAgIGxldCBuZXdWYWx1ZSA9ICh2YWx1ZSA9PSBudWxsIHx8IDxhbnk+dmFsdWUgPT09ICcnKSA/IDEgOiArdmFsdWU7XHJcbiAgICAgICAgaWYgKG5ld1ZhbHVlIDwgMClcclxuICAgICAgICAgICAgbmV3VmFsdWUgPSAwO1xyXG4gICAgICAgIGlmIChuZXdWYWx1ZSA+IDI0KVxyXG4gICAgICAgICAgICBuZXdWYWx1ZSA9IDI0O1xyXG4gICAgICAgIGlmIChpc05hTihuZXdWYWx1ZSkpXHJcbiAgICAgICAgICAgIG5ld1ZhbHVlID0gMDtcclxuICAgICAgICBpZiAobmV3VmFsdWUgIT09IHRoaXMuX3opIHtcclxuICAgICAgICAgICAgaWYgKHRoaXMuX3ogIT0gbnVsbClcclxuICAgICAgICAgICAgICAgIHRoaXMucm5kci5yZW1vdmVDbGFzcyh0aGlzLl9lbG0ubmF0aXZlRWxlbWVudCwgJ21kYy1lbGV2YXRpb24tLXonICsgdGhpcy5feik7XHJcbiAgICAgICAgICAgIHRoaXMucm5kci5hZGRDbGFzcyh0aGlzLl9lbG0ubmF0aXZlRWxlbWVudCwgJ21kYy1lbGV2YXRpb24tLXonICsgbmV3VmFsdWUpO1xyXG4gICAgICAgIH1cclxuICAgICAgICB0aGlzLl96ID0gbmV3VmFsdWU7XHJcbiAgICB9XHJcblxyXG4gICAgc3RhdGljIG5nQWNjZXB0SW5wdXRUeXBlX21kY0VsZXZhdGlvbjogc3RyaW5nIHwgbnVtYmVyO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogV2hlbiB0aGlzIGlucHV0IGlzIGRlZmluZWQgYW5kIGRvZXMgbm90IGhhdmUgdmFsdWUgZmFsc2UsIGNoYW5nZXMgb2YgdGhlIGVsZXZhdGlvblxyXG4gICAgICogd2lsbCBiZSBhbmltYXRlZC5cclxuICAgICAqL1xyXG4gICAgQEhvc3RCaW5kaW5nKCdjbGFzcy5tZGMtZWxldmF0aW9uLXRyYW5zaXRpb24nKVxyXG4gICAgQElucHV0KCkgZ2V0IGFuaW1hdGVUcmFuc2l0aW9uKCkge1xyXG4gICAgICAgIHJldHVybiB0aGlzLl90cmFuc2l0aW9uO1xyXG4gICAgfVxyXG5cclxuICAgIHNldCBhbmltYXRlVHJhbnNpdGlvbih2YWx1ZTogYm9vbGVhbikge1xyXG4gICAgICAgIHRoaXMuX3RyYW5zaXRpb24gPSBhc0Jvb2xlYW4odmFsdWUpO1xyXG4gICAgfVxyXG5cclxuICAgIHN0YXRpYyBuZ0FjY2VwdElucHV0VHlwZV9hbmltYXRlVHJhbnNpdGlvbjogYm9vbGVhbiB8ICcnO1xyXG59XHJcbiJdfQ==