materialize-angular
Version:
Material UI Angular library
1,379 lines (1,357 loc) • 280 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/router'), require('@angular/platform-browser')) :
typeof define === 'function' && define.amd ? define('materialize-angular', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/router', '@angular/platform-browser'], factory) :
(global = global || self, factory(global['materialize-angular'] = {}, global.ng.core, global.ng.common, global.ng.forms, global.ng.router, global.ng.platformBrowser));
}(this, (function (exports, core, common, forms, router, platformBrowser) { 'use strict';
/**
* @fileoverview added by tsickle
* Generated from: app/config/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @license
* Copyright Workylab. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://raw.githubusercontent.com/workylab/materialize-angular/master/LICENSE
*/
/** @type {?} */
var config = {
components: {
prefix: 'materialize'
}
};
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/collapsible/collapsible.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var CollapsibleComponent = /** @class */ (function () {
function CollapsibleComponent(renderer) {
this.renderer = renderer;
this.className = CollapsibleComponent.defaultProps.className;
this.disabled = CollapsibleComponent.defaultProps.disabled;
this.isOpen = CollapsibleComponent.defaultProps.isOpen;
this.showIndicator = CollapsibleComponent.defaultProps.showIndicator;
this.prefix = config.components.prefix;
this.onCloseEmitter = new core.EventEmitter();
this.onOpenEmitter = new core.EventEmitter();
this.onToggle = this.onToggle.bind(this);
this.update = this.update.bind(this);
window.addEventListener('resize', this.update);
}
/**
* @return {?}
*/
CollapsibleComponent.prototype.ngAfterContentInit = /**
* @return {?}
*/
function () {
var _this = this;
if (this.isOpen) {
setTimeout((/**
* @return {?}
*/
function () {
_this.update();
}), 300);
}
};
/**
* @return {?}
*/
CollapsibleComponent.prototype.ngOnChanges = /**
* @return {?}
*/
function () {
this.update();
};
/**
* @return {?}
*/
CollapsibleComponent.prototype.onToggle = /**
* @return {?}
*/
function () {
if (!this.disabled) {
if (this.isOpen) {
this.close();
this.onCloseEmitter.emit();
}
else {
this.open();
this.onOpenEmitter.emit();
}
}
};
/**
* @return {?}
*/
CollapsibleComponent.prototype.open = /**
* @return {?}
*/
function () {
this.isOpen = true;
this.update();
};
/**
* @return {?}
*/
CollapsibleComponent.prototype.close = /**
* @return {?}
*/
function () {
this.isOpen = false;
this.update();
};
/**
* @return {?}
*/
CollapsibleComponent.prototype.update = /**
* @return {?}
*/
function () {
/** @type {?} */
var contentContainer = this.containerRef.nativeElement;
/** @type {?} */
var maxHeight = this.isOpen
? contentContainer.scrollHeight
: 0;
this.renderer.setStyle(contentContainer, 'maxHeight', maxHeight + "px");
};
CollapsibleComponent.defaultProps = {
className: '',
disabled: false,
isOpen: false,
showIndicator: true
};
CollapsibleComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-collapsible }",
template: "<div\n [ngClass]=\"[prefix + '-collapsible', className]\"\n [class.disabled]=\"disabled\"\n [class.open]=\"isOpen\"\n>\n <div (click)=\"onToggle()\"\n [isRippleActive]=\"!disabled\"\n [ngClass]=\"[prefix + '-collapsible-title', className]\"\n\n materializeRipple\n >\n <ng-content select=\"materialize-collapsible-title\"></ng-content>\n\n <materialize-icon *ngIf=\"showIndicator\" [className]=\"prefix + '-collapsible-title-icon'\">\n expand_more\n </materialize-icon>\n </div>\n\n <div [ngClass]=\"[prefix + '-collapsible-content-container', className]\" #container>\n <div [ngClass]=\"prefix + '-collapsible-content'\">\n <ng-content select=\"materialize-collapsible-content\"></ng-content>\n </div>\n </div>\n</div>\n"
}] }
];
/** @nocollapse */
CollapsibleComponent.ctorParameters = function () { return [
{ type: core.Renderer2 }
]; };
CollapsibleComponent.propDecorators = {
onCloseEmitter: [{ type: core.Output, args: ['onClose',] }],
onOpenEmitter: [{ type: core.Output, args: ['onOpen',] }],
containerRef: [{ type: core.ViewChild, args: ['container', { static: true },] }],
className: [{ type: core.Input }],
disabled: [{ type: core.Input }],
isOpen: [{ type: core.Input }],
showIndicator: [{ type: core.Input }]
};
return CollapsibleComponent;
}());
if (false) {
/** @type {?} */
CollapsibleComponent.defaultProps;
/** @type {?} */
CollapsibleComponent.prototype.onCloseEmitter;
/** @type {?} */
CollapsibleComponent.prototype.onOpenEmitter;
/** @type {?} */
CollapsibleComponent.prototype.containerRef;
/** @type {?} */
CollapsibleComponent.prototype.className;
/** @type {?} */
CollapsibleComponent.prototype.disabled;
/** @type {?} */
CollapsibleComponent.prototype.isOpen;
/** @type {?} */
CollapsibleComponent.prototype.showIndicator;
/** @type {?} */
CollapsibleComponent.prototype.prefix;
/**
* @type {?}
* @private
*/
CollapsibleComponent.prototype.renderer;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/accordion/accordion.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AccordionComponent = /** @class */ (function () {
function AccordionComponent() {
this.className = AccordionComponent.defaultProps.className;
this.activeIndex = AccordionComponent.defaultProps.activeIndex;
this.initCollapsibles = this.initCollapsibles.bind(this);
this.registerCollapsibles = this.registerCollapsibles.bind(this);
this.onToggleEmitter = new core.EventEmitter();
}
/**
* @return {?}
*/
AccordionComponent.prototype.ngAfterContentInit = /**
* @return {?}
*/
function () {
this.initCollapsibles();
this.collapsiblesQueryList.changes.subscribe(this.initCollapsibles);
};
/**
* @return {?}
*/
AccordionComponent.prototype.initCollapsibles = /**
* @return {?}
*/
function () {
setTimeout(this.registerCollapsibles, 0);
};
/**
* @return {?}
*/
AccordionComponent.prototype.registerCollapsibles = /**
* @return {?}
*/
function () {
var _this = this;
this.collapsiblesQueryList.forEach((/**
* @param {?} item
* @param {?} index
* @return {?}
*/
function (item, index) {
item.onOpenEmitter.subscribe((/**
* @return {?}
*/
function () {
_this.toggleCollapsibles(index);
}));
}));
};
/**
* @param {?} currentIndex
* @return {?}
*/
AccordionComponent.prototype.toggleCollapsibles = /**
* @param {?} currentIndex
* @return {?}
*/
function (currentIndex) {
this.activeIndex = currentIndex;
this.onToggleEmitter.emit(this.activeIndex);
this.collapsiblesQueryList.forEach((/**
* @param {?} item
* @param {?} index
* @return {?}
*/
function (item, index) {
if (index === currentIndex) {
item.open();
}
else {
item.close();
}
}));
};
/**
* @return {?}
*/
AccordionComponent.prototype.showNext = /**
* @return {?}
*/
function () {
/** @type {?} */
var nextIndex = this.activeIndex === null || this.activeIndex >= this.collapsiblesQueryList.length
? null
: this.activeIndex + 1;
this.toggleCollapsibles(nextIndex);
};
/**
* @return {?}
*/
AccordionComponent.prototype.showPrev = /**
* @return {?}
*/
function () {
/** @type {?} */
var prevIndex = this.activeIndex === null || this.activeIndex === 0
? null
: this.activeIndex - 1;
this.toggleCollapsibles(prevIndex);
};
AccordionComponent.defaultProps = {
activeIndex: null,
className: ''
};
AccordionComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-accordion }",
template: "<div [ngClass]=\"className\">\n <ng-content select=\"materialize-collapsible\"></ng-content>\n</div>\n"
}] }
];
/** @nocollapse */
AccordionComponent.ctorParameters = function () { return []; };
AccordionComponent.propDecorators = {
collapsiblesQueryList: [{ type: core.ContentChildren, args: [CollapsibleComponent,] }],
onToggleEmitter: [{ type: core.Output, args: ['onToggle',] }],
className: [{ type: core.Input }]
};
return AccordionComponent;
}());
if (false) {
/** @type {?} */
AccordionComponent.defaultProps;
/** @type {?} */
AccordionComponent.prototype.collapsiblesQueryList;
/** @type {?} */
AccordionComponent.prototype.onToggleEmitter;
/** @type {?} */
AccordionComponent.prototype.className;
/** @type {?} */
AccordionComponent.prototype.activeIndex;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/collapsible/collapsible-content/collapsible-content.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var CollapsibleContentComponent = /** @class */ (function () {
function CollapsibleContentComponent() {
}
CollapsibleContentComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-collapsible-content }",
template: "<ng-content></ng-content>\n"
}] }
];
return CollapsibleContentComponent;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/collapsible/collapsible-title/collapsible-title.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var CollapsibleTitleComponent = /** @class */ (function () {
function CollapsibleTitleComponent() {
}
CollapsibleTitleComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-collapsible-title }",
template: "<ng-content></ng-content>\n"
}] }
];
return CollapsibleTitleComponent;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/common/prefix.directive.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var PrefixDirective = /** @class */ (function () {
function PrefixDirective() {
}
PrefixDirective.decorators = [
{ type: core.Directive, args: [{
selector: '[materializePrefix]'
},] }
];
return PrefixDirective;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/common/ripple.directive.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @record
*/
function Coordinate() { }
if (false) {
/** @type {?} */
Coordinate.prototype.x;
/** @type {?} */
Coordinate.prototype.y;
}
var RippleDirective = /** @class */ (function () {
function RippleDirective(elementRef, renderer) {
this.elementRef = elementRef;
this.renderer = renderer;
this.rippleDuration = 500;
this.isRippleActive = true;
this.isRippleCenter = false;
this.prefix = config.components.prefix;
this.createRipple = this.createRipple.bind(this);
this.element = this.elementRef.nativeElement;
this.renderer.addClass(this.element, this.prefix + "-ripple-element");
}
/**
* @return {?}
*/
RippleDirective.prototype.ngOnInit = /**
* @return {?}
*/
function () {
if (!this.isRippleActive) {
this.renderer.addClass(this.element, 'disabled');
}
};
/**
* @param {?} event
* @return {?}
*/
RippleDirective.prototype.createRipple = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (!this.isRippleActive) {
return;
}
/** @type {?} */
var coordinates = this.isRippleCenter
? this.getCoordinatesByCenter()
: this.getCoordinatesByEvent(event);
/** @type {?} */
var radio = this.getRippleRadio(coordinates);
this.renderRipple(radio, coordinates);
};
/**
* @param {?} radio
* @param {?} coordinate
* @return {?}
*/
RippleDirective.prototype.renderRipple = /**
* @param {?} radio
* @param {?} coordinate
* @return {?}
*/
function (radio, coordinate) {
/** @type {?} */
var ripple = this.renderer.createElement('div');
/** @type {?} */
var centerY = coordinate.y - radio;
/** @type {?} */
var centerX = coordinate.x - radio;
this.renderer.addClass(ripple, 'ripple');
this.renderer.setStyle(ripple, 'height', radio * 2 + "px");
this.renderer.setStyle(ripple, 'width', radio * 2 + "px");
this.renderer.setStyle(ripple, 'top', centerY + "px");
this.renderer.setStyle(ripple, 'left', centerX + "px");
this.renderer.insertBefore(this.element, ripple, this.element.firstChild);
this.scaleRipple(ripple);
};
/**
* @return {?}
*/
RippleDirective.prototype.getCoordinatesByCenter = /**
* @return {?}
*/
function () {
var _a = this.element, offsetHeight = _a.offsetHeight, offsetWidth = _a.offsetWidth;
/** @type {?} */
var y = offsetHeight / 2;
/** @type {?} */
var x = offsetWidth / 2;
return { x: x, y: y };
};
/**
* @param {?} event
* @return {?}
*/
RippleDirective.prototype.getCoordinatesByEvent = /**
* @param {?} event
* @return {?}
*/
function (event) {
/** @type {?} */
var offset = this.getOffset(this.element);
/** @type {?} */
var y = event.pageY - offset.top;
/** @type {?} */
var x = event.pageX - offset.left;
return { x: x, y: y };
};
/**
* @param {?} coordinate
* @return {?}
*/
RippleDirective.prototype.getRippleRadio = /**
* @param {?} coordinate
* @return {?}
*/
function (coordinate) {
/** @type {?} */
var height = Math.max(this.element.offsetHeight - coordinate.y, coordinate.y);
/** @type {?} */
var width = Math.max(this.element.offsetWidth - coordinate.x, coordinate.x);
/** @type {?} */
var radio = Math.hypot(height, width);
return radio;
};
/**
* @param {?} ripple
* @return {?}
*/
RippleDirective.prototype.scaleRipple = /**
* @param {?} ripple
* @return {?}
*/
function (ripple) {
var _this = this;
setTimeout((/**
* @return {?}
*/
function () {
ripple.style.transitionDuration = _this.rippleDuration + "ms";
ripple.style.transform = 'scale(1)';
_this.hideRipple(ripple);
}), 0);
};
/**
* @param {?} ripple
* @return {?}
*/
RippleDirective.prototype.hideRipple = /**
* @param {?} ripple
* @return {?}
*/
function (ripple) {
var _this = this;
setTimeout((/**
* @return {?}
*/
function () {
_this.renderer.setStyle(ripple, 'transitionDuration', _this.rippleDuration + "ms");
_this.renderer.setStyle(ripple, 'opacity', '0');
_this.removeRipple(ripple);
}), this.rippleDuration);
};
/**
* @param {?} ripple
* @return {?}
*/
RippleDirective.prototype.removeRipple = /**
* @param {?} ripple
* @return {?}
*/
function (ripple) {
var _this = this;
setTimeout((/**
* @return {?}
*/
function () {
_this.renderer.removeChild(_this.element, ripple);
}), this.rippleDuration);
};
/**
* @param {?} element
* @return {?}
*/
RippleDirective.prototype.getOffset = /**
* @param {?} element
* @return {?}
*/
function (element) {
/** @type {?} */
var rect = element.getBoundingClientRect();
/** @type {?} */
var top = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
/** @type {?} */
var left = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
/** @type {?} */
var offset = {
left: rect.left + left,
top: rect.top + top
};
return offset;
};
RippleDirective.decorators = [
{ type: core.Directive, args: [{
selector: "[" + config.components.prefix + "Ripple]"
},] }
];
/** @nocollapse */
RippleDirective.ctorParameters = function () { return [
{ type: core.ElementRef },
{ type: core.Renderer2 }
]; };
RippleDirective.propDecorators = {
rippleDuration: [{ type: core.Input }],
isRippleActive: [{ type: core.Input }],
isRippleCenter: [{ type: core.Input }],
createRipple: [{ type: core.HostListener, args: ['mousedown', ['$event'],] }]
};
return RippleDirective;
}());
if (false) {
/** @type {?} */
RippleDirective.prototype.rippleDuration;
/** @type {?} */
RippleDirective.prototype.isRippleActive;
/** @type {?} */
RippleDirective.prototype.isRippleCenter;
/**
* @type {?}
* @private
*/
RippleDirective.prototype.element;
/**
* @type {?}
* @private
*/
RippleDirective.prototype.prefix;
/**
* @type {?}
* @private
*/
RippleDirective.prototype.elementRef;
/**
* @type {?}
* @private
*/
RippleDirective.prototype.renderer;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/common/suffix.directive.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var SuffixDirective = /** @class */ (function () {
function SuffixDirective() {
}
SuffixDirective.decorators = [
{ type: core.Directive, args: [{
selector: '[materializeSuffix]'
},] }
];
return SuffixDirective;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/common/common.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MaterializeCommonModule = /** @class */ (function () {
function MaterializeCommonModule() {
}
MaterializeCommonModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [
PrefixDirective,
RippleDirective,
SuffixDirective
],
exports: [
PrefixDirective,
RippleDirective,
SuffixDirective
],
imports: [common.CommonModule]
},] }
];
return MaterializeCommonModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/icon/icon.model.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @license
* Copyright Workylab. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://raw.githubusercontent.com/workylab/materialize-angular/master/LICENSE
*/
/**
* @record
*/
function IconModel() { }
if (false) {
/** @type {?} */
IconModel.prototype.className;
/** @type {?} */
IconModel.prototype.size;
}
/** @enum {string} */
var ICON_SIZES = {
NONE: "",
XS: "xs",
SM: "sm",
MD: "md",
LG: "lg",
XL: "xl",
};
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/icon/icon.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var IconComponent = /** @class */ (function () {
function IconComponent() {
this.className = IconComponent.defaultProps.className;
this.size = IconComponent.defaultProps.size;
this.prefix = config.components.prefix;
this.onClickEmitter = new core.EventEmitter();
this.onBlurEmitter = new core.EventEmitter();
}
/**
* @return {?}
*/
IconComponent.prototype.onClick = /**
* @return {?}
*/
function () {
this.onClickEmitter.emit();
};
/**
* @return {?}
*/
IconComponent.prototype.onBlur = /**
* @return {?}
*/
function () {
this.onBlurEmitter.emit();
};
IconComponent.defaultProps = {
className: '',
size: ICON_SIZES.NONE
};
IconComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-icon }",
template: "<span class=\"icon\" [ngClass]=\"[prefix + '-icon', size, className]\" (click)=\"onClick()\" (blur)=\"onBlur()\">\n <ng-content></ng-content>\n</span>\n"
}] }
];
/** @nocollapse */
IconComponent.ctorParameters = function () { return []; };
IconComponent.propDecorators = {
onClickEmitter: [{ type: core.Output, args: ['onClick',] }],
onBlurEmitter: [{ type: core.Output, args: ['onBlur',] }],
className: [{ type: core.Input }],
size: [{ type: core.Input }]
};
return IconComponent;
}());
if (false) {
/** @type {?} */
IconComponent.defaultProps;
/** @type {?} */
IconComponent.prototype.onClickEmitter;
/** @type {?} */
IconComponent.prototype.onBlurEmitter;
/** @type {?} */
IconComponent.prototype.className;
/** @type {?} */
IconComponent.prototype.size;
/** @type {?} */
IconComponent.prototype.prefix;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/icon/icon.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MaterializeIconModule = /** @class */ (function () {
function MaterializeIconModule() {
}
MaterializeIconModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [IconComponent],
exports: [IconComponent],
imports: [common.CommonModule]
},] }
];
return MaterializeIconModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/collapsible/collapsible.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MaterializeCollapsibleModule = /** @class */ (function () {
function MaterializeCollapsibleModule() {
}
MaterializeCollapsibleModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [
CollapsibleComponent,
CollapsibleContentComponent,
CollapsibleTitleComponent
],
exports: [
CollapsibleComponent,
CollapsibleContentComponent,
CollapsibleTitleComponent
],
imports: [
common.CommonModule,
MaterializeIconModule,
MaterializeCommonModule
]
},] }
];
return MaterializeCollapsibleModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/accordion/accordion.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MaterializeAccordionModule = /** @class */ (function () {
function MaterializeAccordionModule() {
}
MaterializeAccordionModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [AccordionComponent],
exports: [AccordionComponent],
imports: [
MaterializeCollapsibleModule,
common.CommonModule,
MaterializeCommonModule
]
},] }
];
return MaterializeAccordionModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/accordion/accordion.model.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @license
* Copyright Workylab. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://raw.githubusercontent.com/workylab/materialize-angular/master/LICENSE
*/
/**
* @record
*/
function AccordionModel() { }
if (false) {
/** @type {?} */
AccordionModel.prototype.activeIndex;
/** @type {?} */
AccordionModel.prototype.className;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button/button.model.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @license
* Copyright Workylab. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://raw.githubusercontent.com/workylab/materialize-angular/master/LICENSE
*/
/**
* @record
*/
function ButtonModel() { }
if (false) {
/** @type {?} */
ButtonModel.prototype.className;
/** @type {?} */
ButtonModel.prototype.disabled;
/** @type {?} */
ButtonModel.prototype.level;
/** @type {?} */
ButtonModel.prototype.rippleDuration;
/** @type {?} */
ButtonModel.prototype.type;
}
/** @enum {string} */
var BUTTON_LEVELS = {
TEXT: "text",
ACCENT: "accent",
OUTLINE: "outline",
};
/** @enum {string} */
var BUTTON_TYPES = {
BUTTON: "button",
SUBMIT: "submit",
RESET: "reset",
};
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button/button.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var ButtonComponent = /** @class */ (function () {
function ButtonComponent() {
this.className = ButtonComponent.defaultProps.className;
this.disabled = ButtonComponent.defaultProps.disabled;
this.level = ButtonComponent.defaultProps.level;
this.rippleDuration = ButtonComponent.defaultProps.rippleDuration;
this.type = ButtonComponent.defaultProps.type;
this.prefix = config.components.prefix;
this.isFocused = false;
this.onBlurEmitter = new core.EventEmitter();
this.onClickEmitter = new core.EventEmitter();
}
/**
* @return {?}
*/
ButtonComponent.prototype.onFocus = /**
* @return {?}
*/
function () {
if (!this.disabled) {
this.isFocused = true;
}
};
/**
* @return {?}
*/
ButtonComponent.prototype.onClick = /**
* @return {?}
*/
function () {
if (!this.disabled) {
this.isFocused = false;
this.onClickEmitter.emit();
}
};
/**
* @return {?}
*/
ButtonComponent.prototype.onBlur = /**
* @return {?}
*/
function () {
this.onBlurEmitter.emit();
this.isFocused = false;
};
ButtonComponent.defaultProps = {
className: '',
disabled: false,
level: BUTTON_LEVELS.ACCENT,
rippleDuration: 250,
type: BUTTON_TYPES.BUTTON
};
ButtonComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-button }",
template: "<button [ngClass]=\"[prefix + '-button', level, className]\"\n (blur)=\"onBlur()\"\n (click)=\"onClick()\"\n (focus)=\"onFocus()\"\n\n materializeRipple\n [isRippleActive]=\"!disabled\"\n [rippleDuration]=\"rippleDuration\"\n \n [class.focused]=\"isFocused\"\n [disabled]=\"disabled\"\n [type]=\"type\"\n \n #element>\n <ng-content></ng-content>\n</button>\n"
}] }
];
/** @nocollapse */
ButtonComponent.ctorParameters = function () { return []; };
ButtonComponent.propDecorators = {
className: [{ type: core.Input }],
disabled: [{ type: core.Input }],
level: [{ type: core.Input }],
rippleDuration: [{ type: core.Input }],
type: [{ type: core.Input }],
onBlurEmitter: [{ type: core.Output, args: ['onBlur',] }],
onClickEmitter: [{ type: core.Output, args: ['onClick',] }],
element: [{ type: core.ViewChild, args: ['element', { static: true },] }]
};
return ButtonComponent;
}());
if (false) {
/** @type {?} */
ButtonComponent.defaultProps;
/** @type {?} */
ButtonComponent.prototype.className;
/** @type {?} */
ButtonComponent.prototype.disabled;
/** @type {?} */
ButtonComponent.prototype.level;
/** @type {?} */
ButtonComponent.prototype.rippleDuration;
/** @type {?} */
ButtonComponent.prototype.type;
/** @type {?} */
ButtonComponent.prototype.onBlurEmitter;
/** @type {?} */
ButtonComponent.prototype.onClickEmitter;
/** @type {?} */
ButtonComponent.prototype.element;
/** @type {?} */
ButtonComponent.prototype.prefix;
/** @type {?} */
ButtonComponent.prototype.isFocused;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button/button.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MaterializeButtonModule = /** @class */ (function () {
function MaterializeButtonModule() {
}
MaterializeButtonModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [ButtonComponent],
exports: [ButtonComponent],
imports: [
common.CommonModule,
MaterializeCommonModule
]
},] }
];
return MaterializeButtonModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button-toggle-group/button-toggle/button-toggle.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var ButtonToggleComponent = /** @class */ (function () {
function ButtonToggleComponent() {
this.className = ButtonToggleComponent.defaultProps.className;
this.disabled = ButtonToggleComponent.defaultProps.disabled;
this.name = ButtonToggleComponent.defaultProps.name;
this.value = ButtonToggleComponent.defaultProps.value;
this.prefix = config.components.prefix;
this.onClickEmitter = new core.EventEmitter();
this.isActive = false;
this.isFocused = false;
}
/**
* @return {?}
*/
ButtonToggleComponent.prototype.onClick = /**
* @return {?}
*/
function () {
if (!this.disabled) {
this.isActive = !this.isActive;
this.isFocused = false;
this.onClickEmitter.emit(this.value);
}
};
/**
* @return {?}
*/
ButtonToggleComponent.prototype.onBlur = /**
* @return {?}
*/
function () {
this.isFocused = false;
};
/**
* @return {?}
*/
ButtonToggleComponent.prototype.onFocus = /**
* @return {?}
*/
function () {
if (!this.disabled) {
this.isFocused = true;
}
};
ButtonToggleComponent.defaultProps = {
className: '',
disabled: false,
name: '',
value: ''
};
ButtonToggleComponent.decorators = [
{ type: core.Component, args: [{
selector: config.components.prefix + "-button-toggle }",
template: "<div (click)=\"onClick()\" (blur)=\"onBlur()\" (focus)=\"onFocus()\"\n\n [ngClass]=\"[prefix + '-button-toggle', className]\"\n [class.active]=\"isActive\"\n [class.disabled]=\"disabled\"\n [class.focused]=\"isFocused\"\n [tabindex]=\"disabled ? '-1': '0'\"\n [isRippleActive]=\"!disabled\"\n\n materializeRipple \n>\n <ng-content></ng-content>\n</div>\n"
}] }
];
/** @nocollapse */
ButtonToggleComponent.ctorParameters = function () { return []; };
ButtonToggleComponent.propDecorators = {
onClickEmitter: [{ type: core.Output, args: ['onClick',] }],
className: [{ type: core.Input }],
disabled: [{ type: core.Input }],
name: [{ type: core.Input }],
value: [{ type: core.Input }]
};
return ButtonToggleComponent;
}());
if (false) {
/** @type {?} */
ButtonToggleComponent.defaultProps;
/** @type {?} */
ButtonToggleComponent.prototype.onClickEmitter;
/** @type {?} */
ButtonToggleComponent.prototype.className;
/** @type {?} */
ButtonToggleComponent.prototype.disabled;
/** @type {?} */
ButtonToggleComponent.prototype.name;
/** @type {?} */
ButtonToggleComponent.prototype.value;
/** @type {?} */
ButtonToggleComponent.prototype.prefix;
/** @type {?} */
ButtonToggleComponent.prototype.isActive;
/** @type {?} */
ButtonToggleComponent.prototype.isFocused;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button-toggle-group/button-toggle-group.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var ButtonToggleGroupComponent = /** @class */ (function () {
function ButtonToggleGroupComponent() {
this.canUncheck = ButtonToggleGroupComponent.defaultProps.canUncheck;
this.className = ButtonToggleGroupComponent.defaultProps.className;
this.disabled = ButtonToggleGroupComponent.defaultProps.disabled;
this.value = ButtonToggleGroupComponent.defaultProps.value;
this.prefix = config.components.prefix;
this.isFocused = false;
this.onChangeEmitter = new core.EventEmitter();
this.initButtons = this.initButtons.bind(this);
this.registerButtons = this.registerButtons.bind(this);
this.toggleButton = this.toggleButton.bind(this);
}
/**
* @return {?}
*/
ButtonToggleGroupComponent.prototype.ngAfterContentInit = /**
* @return {?}
*/
function () {
this.initButtons();
this.buttonsQueryList.changes.subscribe(this.initButtons);
};
/**
* @return {?}
*/
ButtonToggleGroupComponent.prototype.initButtons = /**
* @return {?}
*/
function () {
if (this.disabled) {
this.disableButtons(this.disabled);
}
setTimeout(this.registerButtons, 0);
};
/**
* @param {?} disabled
* @return {?}
*/
ButtonToggleGroupComponent.prototype.disableButtons = /**
* @param {?} disabled
* @return {?}
*/
function (disabled) {
this.buttonsQueryList.forEach((/**
* @param {?} item
* @return {?}
*/
function (item) {
item.disabled = disabled;
}));
};
/**
* @return {?}
*/
ButtonToggleGroupComponent.prototype.registerButtons = /**
* @return {?}
*/
function () {
var _this = this;
this.buttonsQueryList.forEach((/**
* @param {?} button
* @return {?}
*/
function (button) {
button.isActive = (_this.value.lastIndexOf(button.value) >= 0);
button.onClickEmitter.subscribe(_this.toggleButton);
}));
};
/**
* @param {?} value
* @return {?}
*/
ButtonToggleGroupComponent.prototype.toggleButton = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.setValueAllButtons(value);
/** @type {?} */
var currentButton = this.buttonsQueryList.find((/**
* @param {?} item
* @return {?}
*/
function (item) { return item.value === value; }));
this.value = currentButton && currentButton.isActive
? currentButton.value
: '';
this.onTouched();
this.onChange(this.value);
this.onChangeEmitter.emit(this.value);
};
/**
* @param {?} value
* @return {?}
*/
ButtonToggleGroupComponent.prototype.setValueAllButtons = /**
* @param {?} value
* @return {?}
*/
function (value) {
var _this = this;
this.buttonsQueryList.forEach((/**
* @param {?} button
* @return {?}
*/
function (button) {
if (button.value !== value) {
button.isActive = false;
}
if (button.value === value && !_this.canUncheck) {
button.isActive = true;
}
}));
};
/**
* @param {?} isDisabled
* @return {?}
*/
ButtonToggleGroupComponent.prototype.setDisabledState = /**
* @param {?} isDisabled
* @return {?}
*/
function (isDisabled) {
this.disabled = isDisabled;
this.disableButtons(this.disabled);
};
/**
* @param {?} value
* @return {?}
*/
ButtonToggleGroupComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.value = value;
};
/**
* @param {?} fn
* @return {?}
*/
ButtonToggleGroupComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
ButtonToggleGroupComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouched = fn;
};
/**
* @param {?} value
* @return {?}
*/
ButtonToggleGroupComponent.prototype.onChange = /**
* @param {?} value
* @return {?}
*/
function (value) { };
/**
* @return {?}
*/
ButtonToggleGroupComponent.prototype.onTouched = /**
* @return {?}
*/
function () { };
ButtonToggleGroupComponent.defaultProps = {
canUncheck: false,
className: '',
disabled: false,
value: ''
};
ButtonToggleGroupComponent.decorators = [
{ type: core.Component, args: [{
providers: [{
multi: true,
provide: forms.NG_VALUE_ACCESSOR,
useExisting: core.forwardRef((/**
* @return {?}
*/
function () { return ButtonToggleGroupComponent; }))
}],
selector: config.components.prefix + "-button-toggle-group }",
template: "<div \n [ngClass]=\"[prefix + '-button-toggle-group', className]\"\n [class.disabled]=\"disabled\"\n>\n <ng-content select=\"materialize-button-toggle\"></ng-content>\n</div>\n "
}] }
];
/** @nocollapse */
ButtonToggleGroupComponent.ctorParameters = function () { return []; };
ButtonToggleGroupComponent.propDecorators = {
buttonsQueryList: [{ type: core.ContentChildren, args: [ButtonToggleComponent,] }],
onChangeEmitter: [{ type: core.Output, args: ['onChange',] }],
canUncheck: [{ type: core.Input }],
className: [{ type: core.Input }],
disabled: [{ type: core.Input }],
value: [{ type: core.Input }]
};
return ButtonToggleGroupComponent;
}());
if (false) {
/** @type {?} */
ButtonToggleGroupComponent.defaultProps;
/** @type {?} */
ButtonToggleGroupComponent.prototype.buttonsQueryList;
/** @type {?} */
ButtonToggleGroupComponent.prototype.onChangeEmitter;
/** @type {?} */
ButtonToggleGroupComponent.prototype.canUncheck;
/** @type {?} */
ButtonToggleGroupComponent.prototype.className;
/** @type {?} */
ButtonToggleGroupComponent.prototype.disabled;
/** @type {?} */
ButtonToggleGroupComponent.prototype.value;
/** @type {?} */
ButtonToggleGroupComponent.prototype.prefix;
/** @type {?} */
ButtonToggleGroupComponent.prototype.isFocused;
}
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button-toggle-group/button-toggle-group.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MaterializeButtonToggleGroupModule = /** @class */ (function () {
function MaterializeButtonToggleGroupModule() {
}
MaterializeButtonToggleGroupModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [
ButtonToggleComponent,
ButtonToggleGroupComponent
],
exports: [
ButtonToggleComponent,
ButtonToggleGroupComponent
],
imports: [
common.CommonModule,
MaterializeCommonModule
]
},] }
];
return MaterializeButtonToggleGroupModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: app/completed-components/button-toggle-group/button-toggle-group.model.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @license
* Copyright Workylab. All Rights Reserved.
*
* Use of this source code is govern