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);
}
}