mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
Internal refactor completed in order to improve tree shaking and dead code removal. The public API, with an exception to ion-slides, has stayed the same. However, internally many changes were required so bundlers could better exclude modules which should not be bundled. Ultimately most changes resorted to removing references to `window` or `document`, or a module that referenced one of those. BREAKING CHANGES ion-slides was refactored to remove the external dependencies, and rewritten in TypeScript/ES6 modules to again improve tree shaking abilities.
103 lines
2.6 KiB
TypeScript
103 lines
2.6 KiB
TypeScript
import { ElementRef, Renderer } from '@angular/core';
|
|
|
|
import { Config } from '../config/config';
|
|
|
|
/**
|
|
* Base class for all Ionic components. Exposes some common functionality
|
|
* that all Ionic components need, such as accessing underlying native elements and
|
|
* sending/receiving app-level events.
|
|
*/
|
|
export class Ion {
|
|
/** @private */
|
|
_config: Config;
|
|
|
|
/** @private */
|
|
_elementRef: ElementRef;
|
|
|
|
/** @private */
|
|
_renderer: Renderer;
|
|
|
|
/** @private */
|
|
_color: string;
|
|
|
|
/** @private */
|
|
_mode: string;
|
|
|
|
/** @private */
|
|
_componentName: string;
|
|
|
|
constructor(config: Config, elementRef: ElementRef, renderer: Renderer, componentName?: string) {
|
|
this._config = config;
|
|
this._elementRef = elementRef;
|
|
this._renderer = renderer;
|
|
this._componentName = componentName;
|
|
|
|
if (componentName) {
|
|
this._setComponentName();
|
|
this._setMode(config.get('mode'));
|
|
}
|
|
}
|
|
|
|
/** @private */
|
|
setElementClass(className: string, isAdd: boolean) {
|
|
this._renderer.setElementClass(this._elementRef.nativeElement, className, isAdd);
|
|
}
|
|
|
|
/** @private */
|
|
setElementAttribute(attributeName: string, attributeValue: any) {
|
|
this._renderer.setElementAttribute(this._elementRef.nativeElement, attributeName, attributeValue);
|
|
}
|
|
|
|
/** @private */
|
|
setElementStyle(property: string, value: string) {
|
|
this._renderer.setElementStyle(this._elementRef.nativeElement, property, value);
|
|
}
|
|
|
|
/** @private */
|
|
_setColor(newColor: string, componentName?: string) {
|
|
if (componentName) {
|
|
// This is needed for the item-radio
|
|
this._componentName = componentName;
|
|
}
|
|
if (this._color) {
|
|
this.setElementClass(`${this._componentName}-${this._mode}-${this._color}`, false);
|
|
}
|
|
if (newColor) {
|
|
this.setElementClass(`${this._componentName}-${this._mode}-${newColor}`, true);
|
|
this._color = newColor;
|
|
}
|
|
}
|
|
|
|
/** @private */
|
|
_setMode(newMode: string) {
|
|
if (this._mode) {
|
|
this.setElementClass(`${this._componentName}-${this._mode}`, false);
|
|
}
|
|
if (newMode) {
|
|
this.setElementClass(`${this._componentName}-${newMode}`, true);
|
|
|
|
// Remove the color class associated with the previous mode,
|
|
// change the mode, then add the new color class
|
|
this._setColor(null);
|
|
this._mode = newMode;
|
|
this._setColor(this._color);
|
|
}
|
|
}
|
|
|
|
/** @private */
|
|
_setComponentName() {
|
|
this.setElementClass(this._componentName, true);
|
|
}
|
|
|
|
/** @private */
|
|
getElementRef(): ElementRef {
|
|
return this._elementRef;
|
|
}
|
|
|
|
/** @private */
|
|
getNativeElement(): any {
|
|
return this._elementRef.nativeElement;
|
|
}
|
|
|
|
}
|