@angular-mdc/web
Version:
488 lines (477 loc) • 17.7 kB
JavaScript
/**
* @license
* Copyright (c) Dominic Carretto
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/trimox/angular-mdc-web/blob/master/LICENSE
*/
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/cdk/coercion'), require('@angular/cdk/platform'), require('@angular-mdc/web/dom'), require('@material/ripple/util'), require('@material/ripple')) :
typeof define === 'function' && define.amd ? define('@angular-mdc/web/ripple', ['exports', '@angular/core', '@angular/cdk/coercion', '@angular/cdk/platform', '@angular-mdc/web/dom', '@material/ripple/util', '@material/ripple'], factory) :
(global = global || self, factory((global.ng = global.ng || {}, global.ng.web = global.ng.web || {}, global.ng.web.ripple = {}), global.ng.core, global.ng.cdk.coercion, global.ng.cdk.platform, global.ng.web.dom, global.mdc.ripple.util, global.mdc.ripple));
}(this, (function (exports, core, coercion, platform, dom, util, ripple) { 'use strict';
var _assign = function __assign() {
_assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
}
return t;
};
return _assign.apply(this, arguments);
};
/**
* @fileoverview added by tsickle
* Generated from: ripple/ripple.service.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MdcRipple = /** @class */ (function () {
function MdcRipple(element, foundation) {
this.element = element;
this.initialized = false;
this._foundation = foundation || new ripple.MDCRippleFoundation(MdcRipple.createAdapter((/** @type {?} */ ({
_root: element.nativeElement
}))));
}
/**
* @param {?} instance
* @return {?}
*/
MdcRipple.createAdapter = /**
* @param {?} instance
* @return {?}
*/
function (instance) {
/** @type {?} */
var adapter = {
addClass: (/**
* @param {?} className
* @return {?}
*/
function (className) { return instance._root.classList.add(className); }),
removeClass: (/**
* @param {?} className
* @return {?}
*/
function (className) { return instance._root.classList.remove(className); }),
browserSupportsCssVars: (/**
* @return {?}
*/
function () { return typeof window !== 'undefined' ? util.supportsCssVariables(window) : false; }),
isUnbounded: (/**
* @return {?}
*/
function () { return coercion.coerceBooleanProperty(instance.unbounded); }),
isSurfaceActive: (/**
* @return {?}
*/
function () { return dom.matches(instance._root, ':active'); }),
isSurfaceDisabled: (/**
* @return {?}
*/
function () { return coercion.coerceBooleanProperty(instance.disabled); }),
containsEventTarget: (/**
* @param {?} target
* @return {?}
*/
function (target) { return instance._root.contains((/** @type {?} */ (target))); }),
registerDocumentInteractionHandler: (/**
* @template K
* @param {?} evtType
* @param {?} handler
* @return {?}
*/
function (evtType, handler) {
return typeof document === 'object' && !!document ?
(/** @type {?} */ (document.documentElement)).addEventListener(evtType, handler, platform.supportsPassiveEventListeners()) : {};
}),
deregisterDocumentInteractionHandler: (/**
* @template K
* @param {?} evtType
* @param {?} handler
* @return {?}
*/
function (evtType, handler) {
return typeof document === 'object' && !!document ?
(/** @type {?} */ (document.documentElement)).removeEventListener(evtType, handler, platform.supportsPassiveEventListeners()) : {};
}),
registerResizeHandler: (/**
* @param {?} handler
* @return {?}
*/
function (handler) { return typeof window !== 'undefined' ?
window.addEventListener('resize', handler) : {}; }),
deregisterResizeHandler: (/**
* @param {?} handler
* @return {?}
*/
function (handler) { return typeof window !== 'undefined' ?
window.removeEventListener('resize', handler) : {}; }),
updateCssVariable: (/**
* @param {?} varName
* @param {?} value
* @return {?}
*/
function (varName, value) {
return ((/** @type {?} */ (instance._root))).style.setProperty(varName, value);
}),
computeBoundingRect: (/**
* @return {?}
*/
function () { return typeof document === 'object' && !!document ?
instance._root.getBoundingClientRect() : ({ top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 }); }),
getWindowPageOffset: (/**
* @return {?}
*/
function () { return typeof window !== 'undefined' ?
({ x: window.pageXOffset, y: window.pageYOffset }) : ({ x: 0, y: 0 }); }),
registerInteractionHandler: (/**
* @template K
* @param {?} evtType
* @param {?} handler
* @return {?}
*/
function (evtType, handler) {
return ((/** @type {?} */ (instance._root))).addEventListener(evtType, handler, platform.supportsPassiveEventListeners());
}),
deregisterInteractionHandler: (/**
* @template K
* @param {?} evtType
* @param {?} handler
* @return {?}
*/
function (evtType, handler) {
return ((/** @type {?} */ (instance._root))).removeEventListener(evtType, handler, platform.supportsPassiveEventListeners());
})
};
return adapter;
};
/**
* @return {?}
*/
MdcRipple.prototype.init = /**
* @return {?}
*/
function () {
if (!this.initialized) {
this._foundation.init();
this.initialized = true;
}
};
/**
* @return {?}
*/
MdcRipple.prototype.destroy = /**
* @return {?}
*/
function () {
if (this.initialized) {
this.initialized = false;
this._foundation.destroy();
}
};
/**
* @return {?}
*/
MdcRipple.prototype.layout = /**
* @return {?}
*/
function () {
this._foundation.layout();
};
/**
* @return {?}
*/
MdcRipple.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.destroy();
};
/**
* @param {?=} event
* @return {?}
*/
MdcRipple.prototype.activateRipple = /**
* @param {?=} event
* @return {?}
*/
function (event) {
var _this = this;
setTimeout((/**
* @return {?}
*/
function () { return (/** @type {?} */ (_this._foundation)).activate(event); }));
};
/**
* @return {?}
*/
MdcRipple.prototype.deactivateRipple = /**
* @return {?}
*/
function () {
var _this = this;
setTimeout((/**
* @return {?}
*/
function () { return (/** @type {?} */ (_this._foundation)).deactivate(); }));
};
/**
* @return {?}
*/
MdcRipple.prototype.handleBlur = /**
* @return {?}
*/
function () {
this._foundation.handleBlur();
};
MdcRipple.decorators = [
{ type: core.Injectable },
];
/** @nocollapse */
MdcRipple.ctorParameters = function () { return [
{ type: core.ElementRef },
{ type: ripple.MDCRippleFoundation, decorators: [{ type: core.Optional }] }
]; };
return MdcRipple;
}());
/**
* @fileoverview added by tsickle
* Generated from: ripple/ripple.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MdcRippleDirective = /** @class */ (function () {
function MdcRippleDirective(_ripple, elementRef) {
this._ripple = _ripple;
this.elementRef = elementRef;
this._primary = false;
this._secondary = false;
this._disabled = false;
this._unbounded = false;
this._root = this.elementRef.nativeElement;
this._ripple = this._createRipple();
}
Object.defineProperty(MdcRippleDirective.prototype, "attachTo", {
get: /**
* @return {?}
*/
function () {
return this._attachTo;
},
set: /**
* @param {?} element
* @return {?}
*/
function (element) {
var _a, _b;
this._attachTo = element;
(_b = (_a = this._attachTo) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add('mdc-ripple-surface');
},
enumerable: true,
configurable: true
});
Object.defineProperty(MdcRippleDirective.prototype, "primary", {
get: /**
* @return {?}
*/
function () {
return this._primary;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._primary = coercion.coerceBooleanProperty(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(MdcRippleDirective.prototype, "secondary", {
get: /**
* @return {?}
*/
function () {
return this._secondary;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._secondary = coercion.coerceBooleanProperty(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(MdcRippleDirective.prototype, "disabled", {
get: /**
* @return {?}
*/
function () {
return this._disabled;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._disabled = coercion.coerceBooleanProperty(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(MdcRippleDirective.prototype, "unbounded", {
get: /**
* @return {?}
*/
function () {
return this._unbounded;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._unbounded = coercion.coerceBooleanProperty(value);
},
enumerable: true,
configurable: true
});
/**
* @param {?} changes
* @return {?}
*/
MdcRippleDirective.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes['primary'] && this.attachTo) {
if (this._primary) {
this.attachTo.classList.add('mdc-ripple-surface--primary');
}
else {
this.attachTo.classList.remove('mdc-ripple-surface--primary');
}
}
if (changes['secondary'] && this.attachTo) {
if (this._secondary) {
this.attachTo.classList.add('mdc-ripple-surface--accent');
}
else {
this.attachTo.classList.remove('mdc-ripple-surface--accent');
}
}
};
/**
* @return {?}
*/
MdcRippleDirective.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
this._ripple.init();
};
/**
* @return {?}
*/
MdcRippleDirective.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this._ripple.destroy();
};
/**
* @private
* @return {?}
*/
MdcRippleDirective.prototype._createRipple = /**
* @private
* @return {?}
*/
function () {
var _this = this;
/** @type {?} */
var adapter = _assign(_assign({}, MdcRipple.createAdapter(this)), { addClass: (/**
* @param {?} className
* @return {?}
*/
function (className) { var _a, _b; return (_b = (_a = _this.attachTo) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add(className); }), computeBoundingRect: (/**
* @return {?}
*/
function () { var _a, _b; return _b = (_a = _this.attachTo) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect(), (_b !== null && _b !== void 0 ? _b : ({ top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 })); }), isSurfaceActive: (/**
* @return {?}
*/
function () { return dom.matches(_this.attachTo, ':active'); }), isSurfaceDisabled: (/**
* @return {?}
*/
function () { return _this._disabled; }), isUnbounded: (/**
* @return {?}
*/
function () { return _this._unbounded; }), removeClass: (/**
* @param {?} className
* @return {?}
*/
function (className) { var _a, _b; return (_b = (_a = _this.attachTo) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.remove(className); }), updateCssVariable: (/**
* @param {?} varName
* @param {?} value
* @return {?}
*/
function (varName, value) { var _a, _b; return (_b = (_a = _this.attachTo) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b.setProperty(varName, value); }), registerInteractionHandler: (/**
* @param {?} evtType
* @param {?} handler
* @return {?}
*/
function (evtType, handler) { var _a; return (_a = _this.attachTo) === null || _a === void 0 ? void 0 : _a.addEventListener(evtType, handler, platform.supportsPassiveEventListeners()); }), deregisterInteractionHandler: (/**
* @param {?} evtType
* @param {?} handler
* @return {?}
*/
function (evtType, handler) { var _a; return (_a = _this.attachTo) === null || _a === void 0 ? void 0 : _a.removeEventListener(evtType, handler, platform.supportsPassiveEventListeners()); }) });
return new MdcRipple(this.elementRef, new ripple.MDCRippleFoundation(adapter));
};
MdcRippleDirective.decorators = [
{ type: core.Directive, args: [{
selector: '[mdcRipple], mdc-ripple',
providers: [MdcRipple],
},] },
];
/** @nocollapse */
MdcRippleDirective.ctorParameters = function () { return [
{ type: MdcRipple },
{ type: core.ElementRef }
]; };
MdcRippleDirective.propDecorators = {
attachTo: [{ type: core.Input }],
primary: [{ type: core.Input }],
secondary: [{ type: core.Input }],
disabled: [{ type: core.Input }],
unbounded: [{ type: core.Input }]
};
return MdcRippleDirective;
}());
/**
* @fileoverview added by tsickle
* Generated from: ripple/module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MdcRippleModule = /** @class */ (function () {
function MdcRippleModule() {
}
MdcRippleModule.decorators = [
{ type: core.NgModule, args: [{
exports: [MdcRippleDirective],
declarations: [MdcRippleDirective]
},] },
];
return MdcRippleModule;
}());
exports.MdcRipple = MdcRipple;
exports.MdcRippleDirective = MdcRippleDirective;
exports.MdcRippleModule = MdcRippleModule;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=web-ripple.umd.js.map