diff --git a/components/accordion/accordion.ts b/components/accordion/accordion.ts
index f67bbb641bc..437f61c3119 100644
--- a/components/accordion/accordion.ts
+++ b/components/accordion/accordion.ts
@@ -23,7 +23,7 @@ export class Accordion {
     
     public tabs: AccordionTab[] = [];
 
-    constructor(private el: ElementRef) {}
+    constructor(protected el: ElementRef) {}
 
     addTab(tab: AccordionTab) {
         this.tabs.push(tab);
diff --git a/components/accordion/accordiontab.ts b/components/accordion/accordiontab.ts
index df7ad4f7b68..5f975a7742a 100644
--- a/components/accordion/accordiontab.ts
+++ b/components/accordion/accordiontab.ts
@@ -28,7 +28,7 @@ export class AccordionTab {
 
     @ContentChild(Header) headerFacet;
 
-    constructor(private accordion: Accordion) {
+    constructor(protected accordion: Accordion) {
         this.accordion.addTab(this);
     }
 
diff --git a/components/autocomplete/autocomplete.ts b/components/autocomplete/autocomplete.ts
index e682baa5a64..c7cb1cd8435 100644
--- a/components/autocomplete/autocomplete.ts
+++ b/components/autocomplete/autocomplete.ts
@@ -112,7 +112,7 @@ export class AutoComplete implements AfterViewInit,DoCheck,AfterViewChecked,Cont
     
     highlightOptionChanged: boolean;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler, differs: IterableDiffers, private renderer: Renderer) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, differs: IterableDiffers, protected renderer: Renderer) {
         this.differ = differs.find([]).create(null);
     }
     
diff --git a/components/breadcrumb/breadcrumb.ts b/components/breadcrumb/breadcrumb.ts
index 780a0d820bb..6215e3a814f 100644
--- a/components/breadcrumb/breadcrumb.ts
+++ b/components/breadcrumb/breadcrumb.ts
@@ -29,7 +29,7 @@ export class Breadcrumb implements OnDestroy {
 
     @Input() styleClass: string;
     
-    constructor(private router: Router) {}
+    constructor(protected router: Router) {}
     
     itemClick(event, item: MenuItem) {
         if(!item.url||item.routerLink) {
diff --git a/components/button/button.ts b/components/button/button.ts
index d9c5abe6b56..9e49e6edb77 100644
--- a/components/button/button.ts
+++ b/components/button/button.ts
@@ -17,17 +17,17 @@ export class Button implements AfterViewInit, OnDestroy {
 
     @Input() iconPos: string = 'left';
         
-    private _label: string;
+    protected _label: string;
     
-    private hover: boolean;
+    protected hover: boolean;
     
-    private focus: boolean;
+    protected focus: boolean;
     
-    private active: boolean;
+    protected active: boolean;
     
-    private initialized: boolean;
+    protected initialized: boolean;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
     
     ngAfterViewInit() {
         this.domHandler.addMultipleClasses(this.el.nativeElement, this.getStyleClass());
diff --git a/components/calendar/calendar.ts b/components/calendar/calendar.ts
index b31fa9346c9..8dbe0b31090 100644
--- a/components/calendar/calendar.ts
+++ b/components/calendar/calendar.ts
@@ -126,7 +126,7 @@ export class Calendar implements AfterViewInit,OnChanges,OnDestroy,ControlValueA
     
     calendarElement: any;
 
-    constructor(private el: ElementRef, private zone:NgZone) {
+    constructor(protected el: ElementRef, protected zone:NgZone) {
         this.initialized = false;
     }
 
diff --git a/components/carousel/carousel.ts b/components/carousel/carousel.ts
index 7f7dc0895e8..a9cad5d358f 100644
--- a/components/carousel/carousel.ts
+++ b/components/carousel/carousel.ts
@@ -66,37 +66,37 @@ export class Carousel implements OnInit,AfterViewChecked,AfterViewInit,DoCheck,O
     
     @ContentChild(TemplateRef) itemTemplate: TemplateRef<any>;
         
-    private container: any;    
+    protected container: any;    
     
-    private left: any = 0;
+    protected left: any = 0;
     
-    private viewport: any;
+    protected viewport: any;
     
-    private itemsContainer: any;
+    protected itemsContainer: any;
     
-    private items: any;
+    protected items: any;
     
-    private columns: any;
+    protected columns: any;
         
-    private page: number;
+    protected page: number;
                     
-    private valuesChanged: any;
+    protected valuesChanged: any;
     
-    private interval: any;
+    protected interval: any;
     
-    private anchorPageLinks: any[];
+    protected anchorPageLinks: any[];
     
-    private mobileDropdownOptions: any[];
+    protected mobileDropdownOptions: any[];
     
-    private selectDropdownOptions: any[];
+    protected selectDropdownOptions: any[];
     
-    private shrinked: boolean;
+    protected shrinked: boolean;
     
     documentResponsiveListener: any;
     
     differ: any;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, differs: IterableDiffers, private renderer: Renderer) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, differs: IterableDiffers, protected renderer: Renderer) {
         this.differ = differs.find([]).create(null);
     }
     
diff --git a/components/chart/chart.ts b/components/chart/chart.ts
index cf41169544c..183099ce5bc 100644
--- a/components/chart/chart.ts
+++ b/components/chart/chart.ts
@@ -30,7 +30,7 @@ export class UIChart implements AfterViewInit, OnDestroy, DoCheck {
 
     differ: any;
 
-    constructor(private el: ElementRef, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
     }
 
diff --git a/components/codehighlighter/codehighlighter.ts b/components/codehighlighter/codehighlighter.ts
index e77ec296abc..2e2b710f7ef 100644
--- a/components/codehighlighter/codehighlighter.ts
+++ b/components/codehighlighter/codehighlighter.ts
@@ -7,7 +7,7 @@ declare var Prism: any;
 })
 export class CodeHighlighter implements OnInit {
         
-    constructor(private el: ElementRef) {}
+    constructor(protected el: ElementRef) {}
     
     ngOnInit() {
         Prism.highlightElement(this.el.nativeElement);
diff --git a/components/column/columntemplateloader.ts b/components/column/columntemplateloader.ts
index 16a3ed67efd..c2006923ade 100644
--- a/components/column/columntemplateloader.ts
+++ b/components/column/columntemplateloader.ts
@@ -14,7 +14,7 @@ export class ColumnTemplateLoader {
     
     @Input() rowIndex: number;
     
-    constructor(private viewContainer: ViewContainerRef) {}
+    constructor(protected viewContainer: ViewContainerRef) {}
     
     ngOnInit() {
         let view = this.viewContainer.createEmbeddedView(this.column.template, {
diff --git a/components/common.ts b/components/common.ts
index 00844334a91..3fcfe4cf5bc 100644
--- a/components/common.ts
+++ b/components/common.ts
@@ -72,7 +72,7 @@ export class TemplateWrapper implements OnInit {
     
     @Input('pTemplateWrapper') templateRef: TemplateRef<any>;
     
-    constructor(private viewContainer: ViewContainerRef) {}
+    constructor(protected viewContainer: ViewContainerRef) {}
     
     ngOnInit() {
         let view = this.viewContainer.createEmbeddedView(this.templateRef, {
diff --git a/components/contextmenu/contextmenu.ts b/components/contextmenu/contextmenu.ts
index 6e4a6193dd9..32a0d852ee0 100644
--- a/components/contextmenu/contextmenu.ts
+++ b/components/contextmenu/contextmenu.ts
@@ -31,7 +31,7 @@ export class ContextMenuSub {
     
     @Input() root: boolean;
     
-    constructor(private domHandler: DomHandler, private router: Router) {}
+    constructor(protected domHandler: DomHandler, protected router: Router) {}
     
     activeItem: any;
     
@@ -113,7 +113,7 @@ export class ContextMenu implements AfterViewInit,OnDestroy {
     
     documentRightClickListener: any;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
 
     ngAfterViewInit() {
         this.container = this.el.nativeElement.children[0];
diff --git a/components/datagrid/datagrid.ts b/components/datagrid/datagrid.ts
index d2a267004a6..f7a21884f6a 100644
--- a/components/datagrid/datagrid.ts
+++ b/components/datagrid/datagrid.ts
@@ -56,15 +56,15 @@ export class DataGrid implements AfterViewInit,DoCheck {
     
     @ContentChild(TemplateRef) itemTemplate: TemplateRef<any>;
 
-    private dataToRender: any[];
+    protected dataToRender: any[];
 
-    private first: number = 0;
+    protected first: number = 0;
     
-    private page: number = 0;
+    protected page: number = 0;
 
     differ: any;
 
-    constructor(private el: ElementRef, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
     }
 
diff --git a/components/datalist/datalist.ts b/components/datalist/datalist.ts
index 1bb9234c73d..932f3e64c78 100644
--- a/components/datalist/datalist.ts
+++ b/components/datalist/datalist.ts
@@ -59,15 +59,15 @@ export class DataList implements AfterViewInit,DoCheck {
     
     @ContentChild(TemplateRef) itemTemplate: TemplateRef<any>;
 
-    private dataToRender: any[];
+    protected dataToRender: any[];
 
-    private first: number = 0;
+    protected first: number = 0;
     
-    private page: number = 0;
+    protected page: number = 0;
 
     differ: any;
 
-    constructor(private el: ElementRef, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
     }
 
diff --git a/components/datascroller/datascroller.ts b/components/datascroller/datascroller.ts
index e398b9b5d2a..46e2f77f11c 100644
--- a/components/datascroller/datascroller.ts
+++ b/components/datascroller/datascroller.ts
@@ -54,9 +54,9 @@ export class DataScroller implements AfterViewInit,DoCheck,OnDestroy {
     
     @Input() loader: any;
 
-    private dataToRender: any[] = [];
+    protected dataToRender: any[] = [];
 
-    private first: number = 0;
+    protected first: number = 0;
     
     differ: any;
     
@@ -64,7 +64,7 @@ export class DataScroller implements AfterViewInit,DoCheck,OnDestroy {
     
     contentElement: any;
 
-    constructor(private el: ElementRef, differs: IterableDiffers, private renderer: Renderer, private domHandler: DomHandler) {
+    constructor(protected el: ElementRef, differs: IterableDiffers, protected renderer: Renderer, protected domHandler: DomHandler) {
         this.differ = differs.find([]).create(null);
     }
 
diff --git a/components/datatable/datatable.ts b/components/datatable/datatable.ts
index b4c03f1a7cd..4a0afbe8dfe 100644
--- a/components/datatable/datatable.ts
+++ b/components/datatable/datatable.ts
@@ -328,59 +328,59 @@ export class DataTable implements AfterViewChecked,AfterViewInit,OnInit,DoCheck,
     
     @ContentChild(TemplateRef) rowExpansionTemplate: TemplateRef<any>;
     
-    private dataToRender: any[];
+    protected dataToRender: any[];
 
-    private first: number = 0;
+    protected first: number = 0;
 
-    private page: number = 0;
+    protected page: number = 0;
 
-    private filterTimeout: any;
+    protected filterTimeout: any;
 
-    private filters: {[s: string]: FilterMetadata;} = {};
+    protected filters: {[s: string]: FilterMetadata;} = {};
 
-    private filteredValue: any[];
+    protected filteredValue: any[];
 
-    private columns: Column[];
+    protected columns: Column[];
 
-    private columnsUpdated: boolean = false;
+    protected columnsUpdated: boolean = false;
     
-    private stopSortPropagation: boolean;
+    protected stopSortPropagation: boolean;
     
-    private sortColumn: Column;
+    protected sortColumn: Column;
     
-    private percentageScrollHeight: boolean;
+    protected percentageScrollHeight: boolean;
         
-    private scrollBody: any;
+    protected scrollBody: any;
     
-    private scrollHeader: any
+    protected scrollHeader: any
     
-    private scrollHeaderBox: any;
+    protected scrollHeaderBox: any;
     
-    private bodyScrollListener: any;
+    protected bodyScrollListener: any;
     
-    private headerScrollListener: any;
+    protected headerScrollListener: any;
     
-    private resizeScrollListener: any;
+    protected resizeScrollListener: any;
     
-    private columnResizing: boolean;
+    protected columnResizing: boolean;
     
-    private lastPageX: number;
+    protected lastPageX: number;
         
-    private documentColumnResizeListener: any;
+    protected documentColumnResizeListener: any;
     
-    private documentColumnResizeEndListener: any;
+    protected documentColumnResizeEndListener: any;
     
-    private resizerHelper: any;
+    protected resizerHelper: any;
     
-    private resizeColumn: any;
+    protected resizeColumn: any;
     
-    private reorderIndicatorUp: any;
+    protected reorderIndicatorUp: any;
     
-    private reorderIndicatorDown: any;
+    protected reorderIndicatorDown: any;
     
-    private draggedColumn: any;
+    protected draggedColumn: any;
             
-    private tbody: any;
+    protected tbody: any;
 
     differ: any;
 
@@ -390,8 +390,8 @@ export class DataTable implements AfterViewChecked,AfterViewInit,OnInit,DoCheck,
     
     columnsSubscription: Subscription;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, differs: IterableDiffers, 
-        @Query(Column) cols: QueryList<Column>, private renderer: Renderer, changeDetector: ChangeDetectorRef) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, differs: IterableDiffers, 
+        @Query(Column) cols: QueryList<Column>, protected renderer: Renderer, changeDetector: ChangeDetectorRef) {
         this.differ = differs.find([]).create(null);
         this.columnsSubscription = cols.changes.subscribe(_ => {
             this.columns = cols.toArray();
diff --git a/components/datatable/rowexpansionloader.ts b/components/datatable/rowexpansionloader.ts
index 1df313ea59c..1517ffe89d2 100644
--- a/components/datatable/rowexpansionloader.ts
+++ b/components/datatable/rowexpansionloader.ts
@@ -12,7 +12,7 @@ export class RowExpansionLoader {
     
     @Input() rowData: any;
     
-    constructor(private viewContainer: ViewContainerRef) {}
+    constructor(protected viewContainer: ViewContainerRef) {}
     
     ngOnInit() {
         let view = this.viewContainer.createEmbeddedView(this.template, {
diff --git a/components/dialog/dialog.ts b/components/dialog/dialog.ts
index 3c382e8dc87..3d5977b1fdc 100644
--- a/components/dialog/dialog.ts
+++ b/components/dialog/dialog.ts
@@ -101,7 +101,7 @@ export class Dialog implements AfterViewInit,AfterViewChecked,OnDestroy {
     
     positionInitialized: boolean;
             
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
     
     @Input() get visible(): boolean {
         return this._visible;
diff --git a/components/dragdrop/draggable.ts b/components/dragdrop/draggable.ts
index b61d154e0df..ab7db8634df 100644
--- a/components/dragdrop/draggable.ts
+++ b/components/dragdrop/draggable.ts
@@ -22,9 +22,9 @@ export class Draggable {
     
     @Output() onDrag: EventEmitter<any> = new EventEmitter();
     
-    private handle: any;
+    protected handle: any;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
     
     @HostListener('dragstart', ['$event']) 
     dragStart(event) {
diff --git a/components/dragdrop/droppable.ts b/components/dragdrop/droppable.ts
index 7591da45df3..1ec932e93b7 100644
--- a/components/dragdrop/droppable.ts
+++ b/components/dragdrop/droppable.ts
@@ -19,7 +19,7 @@ export class Droppable {
     
     @Output() onDragOver: EventEmitter<any> = new EventEmitter();
 
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
             
     @HostListener('drop', ['$event'])
     drop(event) {
diff --git a/components/dropdown/dropdown.ts b/components/dropdown/dropdown.ts
index 8b36a64a8a1..4c0e47cf4db 100644
--- a/components/dropdown/dropdown.ts
+++ b/components/dropdown/dropdown.ts
@@ -70,7 +70,7 @@ export class Dropdown implements OnInit,AfterViewInit,AfterViewChecked,DoCheck,O
     
     @ContentChild(TemplateRef) itemTemplate: TemplateRef<any>;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
     }
         
@@ -90,27 +90,27 @@ export class Dropdown implements OnInit,AfterViewInit,AfterViewChecked,DoCheck,O
     
     differ: any;
     
-    private panelVisible: boolean = false;
+    protected panelVisible: boolean = false;
     
-    private documentClickListener: any;
+    protected documentClickListener: any;
     
-    private optionsChanged: boolean;
+    protected optionsChanged: boolean;
         
-    private panel: any;
+    protected panel: any;
     
-    private container: any;
+    protected container: any;
     
-    private itemsWrapper: any;
+    protected itemsWrapper: any;
     
-    private initialized: boolean;
+    protected initialized: boolean;
     
-    private selfClick: boolean;
+    protected selfClick: boolean;
     
-    private itemClick: boolean;
+    protected itemClick: boolean;
     
-    private hoveredItem: any;
+    protected hoveredItem: any;
     
-    private selectedOptionUpdated: boolean;
+    protected selectedOptionUpdated: boolean;
             
     ngOnInit() {
         this.optionsToDisplay = this.options;
diff --git a/components/editor/editor.ts b/components/editor/editor.ts
index ee6a77737d3..00d9607a45e 100644
--- a/components/editor/editor.ts
+++ b/components/editor/editor.ts
@@ -90,7 +90,7 @@ export class Editor implements AfterViewInit,ControlValueAccessor {
 
     quill: any;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
 
     ngAfterViewInit() {
         let editorElement = this.domHandler.findSingle(this.el.nativeElement ,'div.ui-editor-content'); 
diff --git a/components/fieldset/fieldset.ts b/components/fieldset/fieldset.ts
index fdd34693b8e..a9b4f5939cf 100644
--- a/components/fieldset/fieldset.ts
+++ b/components/fieldset/fieldset.ts
@@ -31,7 +31,7 @@ export class Fieldset {
         
     @Input() styleClass: string
     
-    private hover: boolean;
+    protected hover: boolean;
     
     onLegendMouseenter(event) {
         if(this.toggleable) {
diff --git a/components/galleria/galleria.ts b/components/galleria/galleria.ts
index f9115521090..beb3395d7c7 100644
--- a/components/galleria/galleria.ts
+++ b/components/galleria/galleria.ts
@@ -63,29 +63,29 @@ export class Galleria implements AfterViewChecked,AfterViewInit,OnDestroy {
     
     slideshowActive: boolean;
     
-    private container: any;
+    protected container: any;
     
-    private panelWrapper: any;
+    protected panelWrapper: any;
     
-    private panels: any;
+    protected panels: any;
     
-    private caption: any;
+    protected caption: any;
     
-    private stripWrapper: any;
+    protected stripWrapper: any;
     
-    private strip: any;
+    protected strip: any;
     
-    private frames: any;
+    protected frames: any;
     
-    private interval: any;
+    protected interval: any;
     
-    private stripLeft: number = 0;
+    protected stripLeft: number = 0;
     
-    private imagesChanged: boolean;
+    protected imagesChanged: boolean;
     
-    private initialized: boolean;
+    protected initialized: boolean;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
     }
     
diff --git a/components/gmap/gmap.ts b/components/gmap/gmap.ts
index 3409bd2928b..facec73dd52 100644
--- a/components/gmap/gmap.ts
+++ b/components/gmap/gmap.ts
@@ -30,7 +30,7 @@ export class GMap implements AfterViewInit,DoCheck {
     
     map: any;
 
-    constructor(private el: ElementRef,differs: IterableDiffers, private cd: ChangeDetectorRef, private zone:NgZone) {
+    constructor(protected el: ElementRef,differs: IterableDiffers, protected cd: ChangeDetectorRef, protected zone:NgZone) {
         this.differ = differs.find([]).create(null);
     }
 
diff --git a/components/growl/growl.ts b/components/growl/growl.ts
index 9f5e446ba86..44750330674 100644
--- a/components/growl/growl.ts
+++ b/components/growl/growl.ts
@@ -41,7 +41,7 @@ export class Growl implements AfterViewInit,DoCheck,OnDestroy {
     
     timeout: any;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
         this.zIndex = DomHandler.zindex;
     }
diff --git a/components/inputmask/inputmask.ts b/components/inputmask/inputmask.ts
index 4d8a512fb40..16a36d5b8d9 100644
--- a/components/inputmask/inputmask.ts
+++ b/components/inputmask/inputmask.ts
@@ -57,7 +57,7 @@ export class InputMask implements AfterViewInit,OnDestroy,ControlValueAccessor {
     
     onModelTouched: Function = () => {};
             
-    constructor(private el: ElementRef) {}
+    constructor(protected el: ElementRef) {}
         
     ngAfterViewInit() {
         let cfg = {
diff --git a/components/inputswitch/inputswitch.ts b/components/inputswitch/inputswitch.ts
index 8c0a4691217..989e771890b 100644
--- a/components/inputswitch/inputswitch.ts
+++ b/components/inputswitch/inputswitch.ts
@@ -49,23 +49,23 @@ export class InputSwitch implements ControlValueAccessor, AfterViewInit {
 
     onModelTouched: Function = () => {};
 
-    private container: any;
+    protected container: any;
 
-    private handle: any;
+    protected handle: any;
 
-    private onContainer: any;
+    protected onContainer: any;
 
-    private offContainer: any;
+    protected offContainer: any;
 
-    private onLabelChild: any;
+    protected onLabelChild: any;
 
-    private offLabelChild: any;
+    protected offLabelChild: any;
 
-    private offset: any;
+    protected offset: any;
     
     initialized: boolean = false;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
 
     ngAfterViewInit() {
         this.container = this.el.nativeElement.children[0];
diff --git a/components/inputtext/inputtext.ts b/components/inputtext/inputtext.ts
index 8603d366a96..06d532cfd34 100644
--- a/components/inputtext/inputtext.ts
+++ b/components/inputtext/inputtext.ts
@@ -18,7 +18,7 @@ export class InputText {
     
     focus: boolean;
     
-    constructor(private el: ElementRef) {}
+    constructor(protected el: ElementRef) {}
     
     @HostListener('mouseover', ['$event']) 
     onMouseover(e) {
diff --git a/components/inputtextarea/inputtextarea.ts b/components/inputtextarea/inputtextarea.ts
index 0761bda778d..ed48cb5aaee 100644
--- a/components/inputtextarea/inputtextarea.ts
+++ b/components/inputtextarea/inputtextarea.ts
@@ -30,7 +30,7 @@ export class InputTextarea implements OnInit {
     
     colsDefault: number;
         
-    constructor(private el: ElementRef) {}
+    constructor(protected el: ElementRef) {}
     
     ngOnInit() {
         this.rowsDefault = this.rows;
diff --git a/components/lightbox/lightbox.ts b/components/lightbox/lightbox.ts
index 77ea858ba61..7dc01fc6670 100644
--- a/components/lightbox/lightbox.ts
+++ b/components/lightbox/lightbox.ts
@@ -47,27 +47,27 @@ export class Lightbox implements AfterViewInit,OnDestroy{
     
     @Input() effectDuration: any = '500ms';
                 
-    private visible: boolean;
+    protected visible: boolean;
     
-    private loading: boolean;
+    protected loading: boolean;
         
-    private currentImage: any;
+    protected currentImage: any;
     
-    private captionText: string;
+    protected captionText: string;
     
-    private zindex: any;
+    protected zindex: any;
     
-    private panel: any;
+    protected panel: any;
     
-    private index: number;
+    protected index: number;
     
-    private mask: any;
+    protected mask: any;
     
-    private preventDocumentClickListener: boolean;
+    protected preventDocumentClickListener: boolean;
     
-    private documentClickListener: any;
+    protected documentClickListener: any;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
                 
     onImageClick(event,image,i,content) {
         this.index = i;
diff --git a/components/listbox/listbox.ts b/components/listbox/listbox.ts
index 7f32df99ca4..2f60cd18a62 100644
--- a/components/listbox/listbox.ts
+++ b/components/listbox/listbox.ts
@@ -51,7 +51,7 @@ export class Listbox implements ControlValueAccessor {
     
     hoveredItem: any;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
     
     writeValue(value: any) : void {
         this.value = value;
diff --git a/components/megamenu/megamenu.ts b/components/megamenu/megamenu.ts
index c69665988e7..1162939d88f 100644
--- a/components/megamenu/megamenu.ts
+++ b/components/megamenu/megamenu.ts
@@ -61,7 +61,7 @@ export class MegaMenu implements OnDestroy {
     
     activeLink: any;
             
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer, private router: Router) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer, protected router: Router) {}
     
     onItemMouseEnter(event, item) {
         this.activeItem = item;
diff --git a/components/menu/menu.ts b/components/menu/menu.ts
index 595d2221034..e8d06cc1cb7 100644
--- a/components/menu/menu.ts
+++ b/components/menu/menu.ts
@@ -51,7 +51,7 @@ export class Menu implements AfterViewInit,OnDestroy {
     
     preventDocumentDefault: any;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer, private router: Router) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer, protected router: Router) {}
 
     ngAfterViewInit() {
         this.container = this.el.nativeElement.children[0];
diff --git a/components/menubar/menubar.ts b/components/menubar/menubar.ts
index 63cff765404..e3535a955f3 100644
--- a/components/menubar/menubar.ts
+++ b/components/menubar/menubar.ts
@@ -31,7 +31,7 @@ export class MenubarSub {
     
     @Input() root: boolean;
     
-    constructor(private domHandler: DomHandler, private router: Router) {}
+    constructor(protected domHandler: DomHandler, protected router: Router) {}
     
     activeItem: any;
     
@@ -109,7 +109,7 @@ export class Menubar implements OnDestroy {
 
     @Input() styleClass: string;
             
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
     
     unsubscribe(item: any) {
         if(item.eventEmitter) {
diff --git a/components/multiselect/multiselect.ts b/components/multiselect/multiselect.ts
index 8c094778b84..ca844a645cd 100644
--- a/components/multiselect/multiselect.ts
+++ b/components/multiselect/multiselect.ts
@@ -89,31 +89,31 @@ export class MultiSelect implements OnInit,AfterViewInit,AfterViewChecked,DoChec
     
     onModelTouched: Function = () => {};
     
-    private valuesAsString: string;
+    protected valuesAsString: string;
     
-    private hover: boolean;
+    protected hover: boolean;
     
-    private focus: boolean;
+    protected focus: boolean;
     
-    private documentClickListener: any;
+    protected documentClickListener: any;
     
-    private panel: any;
+    protected panel: any;
     
-    private container: any;
+    protected container: any;
     
-    private selfClick: boolean;
+    protected selfClick: boolean;
     
-    private panelClick: boolean;
+    protected panelClick: boolean;
     
-    private filterValue: string;
+    protected filterValue: string;
     
-    private visibleOptions: SelectItem[];
+    protected visibleOptions: SelectItem[];
     
-    private filtered: boolean;
+    protected filtered: boolean;
     
     differ: any;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
     }
     
diff --git a/components/orderlist/orderlist.ts b/components/orderlist/orderlist.ts
index e19304b1de3..402404dceff 100644
--- a/components/orderlist/orderlist.ts
+++ b/components/orderlist/orderlist.ts
@@ -58,7 +58,7 @@ export class OrderList implements AfterViewChecked {
         
     listContainer: any;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
          
     ngAfterViewInit() {
         this.listContainer = this.domHandler.findSingle(this.el.nativeElement, 'ul.ui-orderlist-list');
diff --git a/components/overlaypanel/overlaypanel.ts b/components/overlaypanel/overlaypanel.ts
index 2ae33fae480..036d2dbe565 100644
--- a/components/overlaypanel/overlaypanel.ts
+++ b/components/overlaypanel/overlaypanel.ts
@@ -49,7 +49,7 @@ export class OverlayPanel implements OnInit,AfterViewInit,OnDestroy {
     
     target: any;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
 
     ngOnInit() {
         if(this.dismissable) {
diff --git a/components/panel/panel.ts b/components/panel/panel.ts
index e5993440298..f0449ca4f15 100644
--- a/components/panel/panel.ts
+++ b/components/panel/panel.ts
@@ -34,7 +34,7 @@ export class Panel {
 
     @Output() onAfterToggle: EventEmitter<any> = new EventEmitter();
     
-    private hoverToggler: boolean;
+    protected hoverToggler: boolean;
     
     toggle(event) {
         this.onBeforeToggle.emit({originalEvent: event, collapsed: this.collapsed});
diff --git a/components/panelmenu/panelmenu.ts b/components/panelmenu/panelmenu.ts
index 0f5546f47d9..6d7ce6b5f3e 100644
--- a/components/panelmenu/panelmenu.ts
+++ b/components/panelmenu/panelmenu.ts
@@ -27,7 +27,7 @@ export class PanelMenuSub {
     
     @Input() expanded: boolean;
     
-    constructor(private router: Router) {}
+    constructor(protected router: Router) {}
         
     activeItems: MenuItem[] = [];
         
@@ -99,7 +99,7 @@ export class PanelMenu {
     
     activeItems: MenuItem[];
 
-    constructor(private el: ElementRef) {
+    constructor(protected el: ElementRef) {
         this.activeItems = [];
     }
 
diff --git a/components/password/password.ts b/components/password/password.ts
index 918ce3660f3..d30aa89cfaa 100644
--- a/components/password/password.ts
+++ b/components/password/password.ts
@@ -34,7 +34,7 @@ export class Password implements AfterViewInit,OnDestroy {
     
     info: any;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
     
     ngAfterViewInit() {
         this.panel = document.createElement('div');
diff --git a/components/picklist/picklist.ts b/components/picklist/picklist.ts
index e655d6f30d5..e011db14bf9 100644
--- a/components/picklist/picklist.ts
+++ b/components/picklist/picklist.ts
@@ -86,7 +86,7 @@ export class PickList implements OnDestroy,AfterViewChecked {
     
     movedDown: boolean;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
         
     ngAfterViewChecked() {
         if(this.movedUp||this.movedDown) {
diff --git a/components/radiobutton/radiobutton.ts b/components/radiobutton/radiobutton.ts
index 5d6e3bc2cbc..6679dd9cc78 100644
--- a/components/radiobutton/radiobutton.ts
+++ b/components/radiobutton/radiobutton.ts
@@ -42,7 +42,7 @@ export class RadioButton implements ControlValueAccessor {
     
     checked: boolean;
     
-    private hover: boolean;
+    protected hover: boolean;
 
     onclick() {
         if(!this.disabled) {
diff --git a/components/rating/rating.ts b/components/rating/rating.ts
index 5c6b24c3db1..028c2b7fb6d 100644
--- a/components/rating/rating.ts
+++ b/components/rating/rating.ts
@@ -38,9 +38,9 @@ export class Rating implements ControlValueAccessor {
     
     onModelTouched: Function = () => {};
     
-    private starsArray: number[];
+    protected starsArray: number[];
     
-    private hoverCancel: boolean;
+    protected hoverCancel: boolean;
 
     ngOnInit() {
         this.starsArray = [];
diff --git a/components/schedule/schedule.ts b/components/schedule/schedule.ts
index 49567160886..a68ba4b9db3 100644
--- a/components/schedule/schedule.ts
+++ b/components/schedule/schedule.ts
@@ -107,7 +107,7 @@ export class Schedule implements AfterViewInit,DoCheck,OnDestroy {
     
     schedule: any;
 
-    constructor(private el: ElementRef, differs: IterableDiffers) {
+    constructor(protected el: ElementRef, differs: IterableDiffers) {
         this.differ = differs.find([]).create(null);
         this.initialized = false;
     }
diff --git a/components/selectbutton/selectbutton.ts b/components/selectbutton/selectbutton.ts
index e3f2609140d..892b7b2e121 100644
--- a/components/selectbutton/selectbutton.ts
+++ b/components/selectbutton/selectbutton.ts
@@ -40,7 +40,7 @@ export class SelectButton implements ControlValueAccessor {
     
     onModelTouched: Function = () => {};
 
-    private hoveredItem: any;
+    protected hoveredItem: any;
     
     writeValue(value: any) : void {
         this.value = value;
diff --git a/components/slidemenu/slidemenu.ts b/components/slidemenu/slidemenu.ts
index 1a821d79a46..79063225d9a 100644
--- a/components/slidemenu/slidemenu.ts
+++ b/components/slidemenu/slidemenu.ts
@@ -39,7 +39,7 @@ export class SlideMenuSub implements OnDestroy {
         
     @Input() easing: string = 'ease-out';
         
-    constructor(@Inject(forwardRef(() => SlideMenu)) private slideMenu: SlideMenu, private router: Router) {}
+    constructor(@Inject(forwardRef(() => SlideMenu)) protected slideMenu: SlideMenu, protected router: Router) {}
     
     activeItem: any;
         
@@ -114,15 +114,15 @@ export class SlideMenu implements AfterViewInit,OnDestroy {
     
     @Input() backLabel: string = 'Back';
     
-    private container: any;
+    protected container: any;
     
-    private documentClickListener: any;
+    protected documentClickListener: any;
     
-    private preventDocumentDefault: any;
+    protected preventDocumentDefault: any;
         
     public left: number = 0;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
 
     ngAfterViewInit() {
         this.container = this.el.nativeElement.children[0];
diff --git a/components/slider/slider.ts b/components/slider/slider.ts
index 6dc6c7aa4f0..80157c4f5f8 100644
--- a/components/slider/slider.ts
+++ b/components/slider/slider.ts
@@ -45,7 +45,7 @@ export class Slider implements AfterViewInit,OnDestroy,OnChanges,ControlValueAcc
 
     initialized: boolean;
 
-    constructor(private el: ElementRef) {
+    constructor(protected el: ElementRef) {
         this.initialized = false;
     }
 
diff --git a/components/spinner/spinner.ts b/components/spinner/spinner.ts
index 441a08dcba7..5f0f203e670 100644
--- a/components/spinner/spinner.ts
+++ b/components/spinner/spinner.ts
@@ -56,21 +56,21 @@ export class Spinner implements AfterViewInit,ControlValueAccessor {
     
     onModelTouched: Function = () => {};
         
-    private hoverUp: boolean;
+    protected hoverUp: boolean;
     
-    private activeUp: boolean;
+    protected activeUp: boolean;
     
-    private hoverDown: boolean;
+    protected hoverDown: boolean;
     
-    private activeDown: boolean;
+    protected activeDown: boolean;
 
-    private precision: number;
+    protected precision: number;
     
-    private timer: any;
+    protected timer: any;
     
-    private inputtext: any;
+    protected inputtext: any;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
     
     ngAfterViewInit() {
         if(Math.floor(this.step) === 0) {
diff --git a/components/splitbutton/splitbutton.ts b/components/splitbutton/splitbutton.ts
index 1e94f458f42..38e24771cbb 100644
--- a/components/splitbutton/splitbutton.ts
+++ b/components/splitbutton/splitbutton.ts
@@ -60,25 +60,25 @@ export class SplitButton implements OnInit,OnDestroy {
     
     @ContentChildren(SplitButtonItem) items : QueryList<SplitButtonItem>;
     
-    private hoverDefaultBtn: boolean;
+    protected hoverDefaultBtn: boolean;
     
-    private focusDefaultBtn: boolean;
+    protected focusDefaultBtn: boolean;
     
-    private activeDefaultBtn: boolean;
+    protected activeDefaultBtn: boolean;
     
-    private hoverDropdown: boolean;
+    protected hoverDropdown: boolean;
     
-    private focusDropdown: boolean;
+    protected focusDropdown: boolean;
     
-    private activeDropdown: boolean;
+    protected activeDropdown: boolean;
     
-    private hoveredItem: any;
+    protected hoveredItem: any;
     
-    private menuVisible: boolean = false;
+    protected menuVisible: boolean = false;
     
-    private documentClickListener: any;
+    protected documentClickListener: any;
 
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer, private router: Router) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer, protected router: Router) {}
     
     ngOnInit() {
         this.documentClickListener = this.renderer.listenGlobal('body', 'click', () => {
diff --git a/components/tabmenu/tabmenu.ts b/components/tabmenu/tabmenu.ts
index 69eee937bf6..969ac8aa9bd 100644
--- a/components/tabmenu/tabmenu.ts
+++ b/components/tabmenu/tabmenu.ts
@@ -35,7 +35,7 @@ export class TabMenu implements OnDestroy {
 
     @Input() styleClass: string;
     
-    constructor(private router: Router) {}
+    constructor(protected router: Router) {}
         
     hoveredItem: MenuItem;
     
diff --git a/components/tabview/tabview.ts b/components/tabview/tabview.ts
index c561a126237..5696644ee2f 100644
--- a/components/tabview/tabview.ts
+++ b/components/tabview/tabview.ts
@@ -41,7 +41,7 @@ export class TabView {
     
     tabs: TabPanel[];
 
-    constructor(private el: ElementRef,@Query(TabPanel) tabPanels: QueryList<TabPanel>) {
+    constructor(protected el: ElementRef,@Query(TabPanel) tabPanels: QueryList<TabPanel>) {
         tabPanels.changes.subscribe(_ => {
             this.tabs = tabPanels.toArray();
             let selectedTab: TabPanel = this.findSelectedTab();
diff --git a/components/terminal/terminal.ts b/components/terminal/terminal.ts
index 2d173d55da2..201484c0506 100644
--- a/components/terminal/terminal.ts
+++ b/components/terminal/terminal.ts
@@ -43,7 +43,7 @@ export class Terminal implements AfterViewInit,AfterViewChecked {
     
     commandProcessed: boolean;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
     
     ngAfterViewInit() {
         this.container = this.domHandler.find(this.el.nativeElement, '.ui-terminal')[0];
diff --git a/components/tieredmenu/tieredmenu.ts b/components/tieredmenu/tieredmenu.ts
index 12ed1dea9a4..4191a2a2a80 100644
--- a/components/tieredmenu/tieredmenu.ts
+++ b/components/tieredmenu/tieredmenu.ts
@@ -31,7 +31,7 @@ export class TieredMenuSub {
     
     @Input() root: boolean;
     
-    constructor(private domHandler: DomHandler, private router: Router, private location: Location) {}
+    constructor(protected domHandler: DomHandler, protected router: Router, protected location: Location) {}
     
     activeItem: any;
     
@@ -107,7 +107,7 @@ export class TieredMenu implements AfterViewInit,OnDestroy {
     
     preventDocumentDefault: any;
     
-    constructor(private el: ElementRef, private domHandler: DomHandler, private renderer: Renderer) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler, protected renderer: Renderer) {}
 
     ngAfterViewInit() {
         this.container = this.el.nativeElement.children[0];
diff --git a/components/togglebutton/togglebutton.ts b/components/togglebutton/togglebutton.ts
index 9303e16d597..0f5be136d11 100644
--- a/components/togglebutton/togglebutton.ts
+++ b/components/togglebutton/togglebutton.ts
@@ -42,7 +42,7 @@ export class ToggleButton implements ControlValueAccessor {
     
     onModelTouched: Function = () => {};
     
-    private hover: boolean;
+    protected hover: boolean;
 
     getIconClass() {
         let baseClass = 'ui-button-icon-left fa fa-fw';
diff --git a/components/tooltip/tooltip.ts b/components/tooltip/tooltip.ts
index 4eb8f1b5311..0a1448e9d84 100644
--- a/components/tooltip/tooltip.ts
+++ b/components/tooltip/tooltip.ts
@@ -17,7 +17,7 @@ export class Tooltip implements OnDestroy {
         
     container: any;
         
-    constructor(private el: ElementRef, private domHandler: DomHandler) {}
+    constructor(protected el: ElementRef, protected domHandler: DomHandler) {}
         
     @HostListener('mouseenter', ['$event']) 
     onMouseEnter(e) {
diff --git a/components/tree/treenodetemplateloader.ts b/components/tree/treenodetemplateloader.ts
index 5812c82e05d..94205f7892a 100644
--- a/components/tree/treenodetemplateloader.ts
+++ b/components/tree/treenodetemplateloader.ts
@@ -10,7 +10,7 @@ export class TreeNodeTemplateLoader implements OnInit {
     
     @Input() template: TemplateRef<any>;
         
-    constructor(private viewContainer: ViewContainerRef) {}
+    constructor(protected viewContainer: ViewContainerRef) {}
     
     ngOnInit() {
         let view = this.viewContainer.createEmbeddedView(this.template, {
diff --git a/components/tree/uitreenode.ts b/components/tree/uitreenode.ts
index c8601106f85..0b99b9e4c19 100644
--- a/components/tree/uitreenode.ts
+++ b/components/tree/uitreenode.ts
@@ -36,7 +36,7 @@ export class UITreeNode {
         
     expanded: boolean = false;
     
-    constructor(@Inject(forwardRef(() => Tree)) private tree:Tree) {}
+    constructor(@Inject(forwardRef(() => Tree)) protected tree:Tree) {}
         
     getIcon() {
         let icon;
diff --git a/components/treetable/uitreerow.ts b/components/treetable/uitreerow.ts
index d17f04bb00b..0eaf26d3164 100644
--- a/components/treetable/uitreerow.ts
+++ b/components/treetable/uitreerow.ts
@@ -36,7 +36,7 @@ export class UITreeRow {
     
     hover: boolean;
     
-    constructor(@Inject(forwardRef(() => TreeTable)) private treeTable:TreeTable) {}
+    constructor(@Inject(forwardRef(() => TreeTable)) protected treeTable:TreeTable) {}
     
     toggle(event) {
         if(this.expanded)