projects/wvr-elements/src/lib/wvr-color-preview/wvr-color-preview.component.ts
changeDetection | ChangeDetectionStrategy.Default |
selector | wvr-color-preview-component |
styleUrls | ./wvr-color-preview.component.scss |
templateUrl | ./wvr-color-preview.component.html |
Properties |
|
Methods |
Inputs |
Outputs |
HostBindings |
constructor(injector: Injector)
|
||||||
Parameters :
|
animate | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:68
|
|
A setter which parses a json string describing animation instructions and stores the derived object in |
animateConfig | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:76
|
|
A setter which parses a json string describing animation setting and stores the derived object in |
animateId | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:84
|
|
An attribute input allowing for the designation of an animation identifier for the purpose of animation targeting. |
animateTarget | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:87
|
|
An attribute input allowing for the designation of an animation target for animation events. |
hiddenInMobile | |
Type : boolean
|
|
Default value : false
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:107
|
|
An attribute input specifying if this component should be hidden in the mobile layout. |
ngBindings | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:116
|
themeVariant | |
Type : ThemeVariantName
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:55
|
|
Used to define the class type of an alert component. |
wvrData | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:45
|
wvrTheme | |
Type : string
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:50
|
|
Allows for the override of theme for the particular component. |
animationEventTrigger | |
Type : EventEmitter
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:110
|
|
An Output biding used for triggering animations. |
class.wvr-bootstrap |
Type : boolean
|
Default value : true
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:58
|
A host binding used to ensure the presense of the |
class.wvr-hidden |
Type : boolean
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:102
|
A host bound accessor which applies the wvr-hidden class if both isMobileLayout and hiddenInMobile evaluate to true. |
style |
Type : any
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:60
|
index | |||||||||
index(index: number, themeVariant: ThemeVariant)
|
|||||||||
Parameters :
Returns :
number
|
ngOnInit |
ngOnInit()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:25
|
Returns :
void
|
originalOrdering |
originalOrdering()
|
Returns :
number
|
applyThemeOverride |
applyThemeOverride(customProperty: string, value: string)
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:237
|
Returns :
void
|
bootstrapNgBindings |
bootstrapNgBindings()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:175
|
Returns :
void
|
getWvrData |
getWvrData()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:262
|
Returns :
string
|
hasWvrData |
hasWvrData()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:258
|
Returns :
boolean
|
initializeAnimationElement |
initializeAnimationElement()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:267
|
Returns :
void
|
initializeAnimationRegistration |
initializeAnimationRegistration()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:273
|
Returns :
void
|
ngAfterContentInit |
ngAfterContentInit()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:160
|
Used for post content initialization animation setup.
Returns :
void
|
ngOnDestroy |
ngOnDestroy()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:166
|
Handles the the unregistering of this component with the component registry.
Returns :
void
|
onAnimationEvent | ||||||
onAnimationEvent($event: Event)
|
||||||
Inherited from
WvrBaseComponent
|
||||||
Defined in
WvrBaseComponent:290
|
||||||
Trigger's the animation specified by the incoming event.
Parameters :
Returns :
void
|
Private processData |
processData()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:295
|
Returns :
void
|
triggerAnimations | ||||||
triggerAnimations(animationTriggerType: string)
|
||||||
Inherited from
WvrBaseComponent
|
||||||
Defined in
WvrBaseComponent:244
|
||||||
Plays the animation specified by the incoming animation trigger.
Parameters :
Returns :
void
|
currentTheme |
Type : Observable<ThemeVariants>
|
Private _animationConfig |
Type : any
|
Default value : {}
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:73
|
An object representation of the settings specifying the specific behavior of the animation for this component. |
Private Readonly _animationService |
Type : AnimationService<WvrBaseComponent>
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:93
|
A reference to the AnimationService |
Private _animationSettings |
Type : any
|
Default value : {}
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:65
|
An object representation of the animation instructions for this component. |
Private _ngBindings |
Type : literal type
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:114
|
animationRootElem |
Type : ElementRef
|
Decorators :
@ViewChild('animationRoot')
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:90
|
A view child of the template element containing the #animationRoot identifier. |
Private animationStateId |
Type : number
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:81
|
An identifier used to access the animation state for this component. |
Readonly appConfig |
Type : AppConfig
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:37
|
A reference to the AppConfig |
Readonly cdRef |
Type : ChangeDetectorRef
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:34
|
A reference to the ChangeDetectorRef |
Readonly componentRegistry |
Type : ComponentRegistryService<WvrBaseComponent>
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:25
|
A reference to the ComponentRegistryService |
data |
Type : literal type
|
Default value : {}
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:42
|
Readonly eRef |
Type : ElementRef
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:31
|
A reference to the ElementRef |
Readonly id |
Type : number
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:28
|
A generated unique identifier for this comonent. |
isMobile |
Type : Observable<boolean>
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:120
|
isMobileLayout |
Type : boolean
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:112
|
Private Readonly kebabize |
Default value : () => {...}
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:321
|
Private Readonly ngBindingsService |
Type : NgBindingsService
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:99
|
A reference to the NgBindingsService |
Readonly store |
Type : Store<RootState>
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:40
|
A reference to the Store |
style |
Decorators :
@HostBinding('style')
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:60
|
Protected subscriptions |
Type : Array<Subscription>
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:122
|
themeOverrides |
Type : object
|
Default value : {}
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:47
|
Private Readonly themeService |
Type : ThemeService
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:96
|
A reference to the ThemeService |
variantTypes |
Type : []
|
Default value : []
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:62
|
wvrBootstrap |
Default value : true
|
Decorators :
@HostBinding('class.wvr-bootstrap')
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:58
|
A host binding used to ensure the presense of the |
import { ChangeDetectionStrategy, Component, Injector, OnInit } from '@angular/core';
import { select } from '@ngrx/store';
import { Observable } from 'rxjs';
import { selectCurrentTheme } from '../core/store';
import { ThemeVariant, ThemeVariants } from '../shared/theme';
import { WvrBaseComponent } from '../shared/wvr-base.component';
@Component({
selector: 'wvr-color-preview-component',
templateUrl: './wvr-color-preview.component.html',
styleUrls: ['./wvr-color-preview.component.scss'],
changeDetection: ChangeDetectionStrategy.Default
})
export class WvrColorPreviewComponent extends WvrBaseComponent implements OnInit {
currentTheme: Observable<ThemeVariants>;
constructor(injector: Injector) {
super(injector);
}
ngOnInit(): void {
super.ngOnInit();
this.currentTheme = this.store
.pipe(select(selectCurrentTheme));
}
originalOrdering(): number {
return 0;
}
index(index: number, themeVariant: ThemeVariant): number {
return index;
}
}
<div class="inline-block">
<wvr-card-component
class="swatches"
[panelFormat]="'solid'"
[themeVariant]="tv.key"
*ngFor="let tv of currentTheme | async | keyvalue : originalOrdering; trackBy:index">
<template card-header>
<h3>{{tv.key}}</h3>
</template>
<template card-content>
{{tv.value.baseColor}}
</template>
</wvr-card-component>
</div>
./wvr-color-preview.component.scss
:host {
.swatches {
display: inline-block;
margin: 0 10px 10px 0;
}
}