projects/wvr-elements/src/lib/wvr-it-works/wvr-it-works.component.ts
Provides a simple component to prove the basic functionality of the Weaver Components.
changeDetection | ChangeDetectionStrategy.Default |
selector | wvr-it-works-component |
styleUrls | ./wvr-it-works.component.scss |
templateUrl | ./wvr-it-works.component.html |
Properties |
|
Methods |
Inputs |
Outputs |
HostBindings |
constructor(injector: Injector)
|
||||||
Parameters :
|
primary | |
Type : any
|
|
Allows for the override of the --wvr-primary css variable. |
text | |
Type : string
|
|
Default value : 'Weaver Components'
|
|
The text value to be displayed in the title. |
themeVariant | |
Type : ThemeVariantName
|
|
Default value : 'primary'
|
|
Inherited from
WvrBaseComponent
|
|
Defined in
WvrBaseComponent:17
|
|
Used to define the class type for button component. |
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
|
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
|
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
|
ngOnInit |
ngOnInit()
|
Inherited from
WvrBaseComponent
|
Defined in
WvrBaseComponent:145
|
Used to setup this component for animating.
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
|
password |
Type : string
|
Default value : ''
|
title |
Type : string
|
Default value : 'it-works-component'
|
The text value to be displayed in the title. |
username |
Type : string
|
Default value : ''
|
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, HostBinding, Injector, Input } from '@angular/core';
import { ThemeVariantName } from '../shared/theme';
import { WvrBaseComponent } from '../shared/wvr-base.component';
/**
* Provides a simple component to prove the basic functionality of the Weaver Components.
*/
@Component({
selector: 'wvr-it-works-component',
templateUrl: './wvr-it-works.component.html',
styleUrls: ['./wvr-it-works.component.scss'],
changeDetection: ChangeDetectionStrategy.Default
})
export class WvrItWorksComponent extends WvrBaseComponent {
/** Used to define the class type for button component. */
@Input() themeVariant: ThemeVariantName = 'primary';
/** The text value to be displayed in the title. */
title = 'it-works-component';
/** The text value to be displayed in the title. */
@Input() text = 'Weaver Components';
/** Allows for the override of the --wvr-primary css variable. */
@HostBinding('style.--wvr-primary') @Input() primary;
username = '';
password = '';
constructor(injector: Injector) {
super(injector);
}
}
<div role="main" class="container" #animationRoot>
<div class="jumbotron">
<h1 class="it-works text-{{themeVariant}}">{{text}}</h1>
</div>
</div>
./wvr-it-works.component.scss
@import "../shared/styles/variables";
:host {
@extend .variables;
font-family: var(--wvr-font-family-sans-serif);
div.container {
overflow: hidden;
}
.it-works {
color: var(--wvr-primary);
}
}