File

projects/wvr-elements/src/lib/wvr-color-preview/wvr-color-preview.component.ts

Extends

WvrBaseComponent

Implements

OnInit

Metadata

Index

Properties
Methods
Inputs
Outputs
HostBindings

Constructor

constructor(injector: Injector)
Parameters :
Name Type Optional
injector Injector No

Inputs

animate
Type : string
Inherited from WvrBaseComponent

A setter which parses a json string describing animation instructions and stores the derived object in _animationSettings.

animateConfig
Type : string
Inherited from WvrBaseComponent

A setter which parses a json string describing animation setting and stores the derived object in _animationConfig.

animateId
Type : string
Inherited from WvrBaseComponent

An attribute input allowing for the designation of an animation identifier for the purpose of animation targeting.

animateTarget
Type : string
Inherited from WvrBaseComponent

An attribute input allowing for the designation of an animation target for animation events.

hiddenInMobile
Type : boolean
Default value : false
Inherited from WvrBaseComponent

An attribute input specifying if this component should be hidden in the mobile layout.

ngBindings
Type : string
Inherited from WvrBaseComponent
themeVariant
Type : ThemeVariantName
Inherited from WvrBaseComponent

Used to define the class type of an alert component.

wvrData
Type : string
Inherited from WvrBaseComponent
wvrTheme
Type : string
Inherited from WvrBaseComponent

Allows for the override of theme for the particular component.

Outputs

animationEventTrigger
Type : EventEmitter
Inherited from WvrBaseComponent

An Output biding used for triggering animations.

HostBindings

class.wvr-bootstrap
Type : boolean
Default value : true
Inherited from WvrBaseComponent

A host binding used to ensure the presense of the wvr-bootstrap class.

class.wvr-hidden
Type : boolean
Inherited from WvrBaseComponent

A host bound accessor which applies the wvr-hidden class if both isMobileLayout and hiddenInMobile evaluate to true.

style
Type : any
Inherited from WvrBaseComponent

Methods

index
index(index: number, themeVariant: ThemeVariant)
Parameters :
Name Type Optional
index number No
themeVariant ThemeVariant No
Returns : number
ngOnInit
ngOnInit()
Inherited from WvrBaseComponent
Returns : void
originalOrdering
originalOrdering()
Returns : number
applyThemeOverride
applyThemeOverride(customProperty: string, value: string)
Inherited from WvrBaseComponent
Parameters :
Name Type Optional
customProperty string No
value string No
Returns : void
bootstrapNgBindings
bootstrapNgBindings()
Inherited from WvrBaseComponent
Returns : void
getWvrData
getWvrData()
Inherited from WvrBaseComponent
Returns : string
hasWvrData
hasWvrData()
Inherited from WvrBaseComponent
Returns : boolean
initializeAnimationElement
initializeAnimationElement()
Inherited from WvrBaseComponent
Returns : void
initializeAnimationRegistration
initializeAnimationRegistration()
Inherited from WvrBaseComponent
Returns : void
ngAfterContentInit
ngAfterContentInit()
Inherited from WvrBaseComponent

Used for post content initialization animation setup.

Returns : void
ngOnDestroy
ngOnDestroy()
Inherited from WvrBaseComponent

Handles the the unregistering of this component with the component registry.

Returns : void
onAnimationEvent
onAnimationEvent($event: Event)
Inherited from WvrBaseComponent

Trigger's the animation specified by the incoming event.

Parameters :
Name Type Optional
$event Event No
Returns : void
Private processData
processData()
Inherited from WvrBaseComponent
Returns : void
triggerAnimations
triggerAnimations(animationTriggerType: string)
Inherited from WvrBaseComponent

Plays the animation specified by the incoming animation trigger.

Parameters :
Name Type Optional
animationTriggerType string No
Returns : void

Properties

currentTheme
Type : Observable<ThemeVariants>
Private _animationConfig
Type : any
Default value : {}
Inherited from WvrBaseComponent

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

A reference to the AnimationService

Private _animationSettings
Type : any
Default value : {}
Inherited from WvrBaseComponent

An object representation of the animation instructions for this component.

Private _ngBindings
Type : literal type
Inherited from WvrBaseComponent
animationRootElem
Type : ElementRef
Decorators :
@ViewChild('animationRoot')
Inherited from WvrBaseComponent

A view child of the template element containing the #animationRoot identifier.

Private animationStateId
Type : number
Inherited from WvrBaseComponent

An identifier used to access the animation state for this component.

Readonly appConfig
Type : AppConfig
Inherited from WvrBaseComponent

A reference to the AppConfig

Readonly cdRef
Type : ChangeDetectorRef
Inherited from WvrBaseComponent

A reference to the ChangeDetectorRef

Readonly componentRegistry
Type : ComponentRegistryService<WvrBaseComponent>
Inherited from WvrBaseComponent

A reference to the ComponentRegistryService

data
Type : literal type
Default value : {}
Inherited from WvrBaseComponent
Readonly eRef
Type : ElementRef
Inherited from WvrBaseComponent

A reference to the ElementRef

Readonly id
Type : number
Inherited from WvrBaseComponent

A generated unique identifier for this comonent.

isMobile
Type : Observable<boolean>
Inherited from WvrBaseComponent
isMobileLayout
Type : boolean
Inherited from WvrBaseComponent
Private Readonly kebabize
Default value : () => {...}
Inherited from WvrBaseComponent
Private Readonly ngBindingsService
Type : NgBindingsService
Inherited from WvrBaseComponent

A reference to the NgBindingsService

Readonly store
Type : Store<RootState>
Inherited from WvrBaseComponent

A reference to the Store

style
Decorators :
@HostBinding('style')
Inherited from WvrBaseComponent
Protected subscriptions
Type : Array<Subscription>
Inherited from WvrBaseComponent
themeOverrides
Type : object
Default value : {}
Inherited from WvrBaseComponent
Private Readonly themeService
Type : ThemeService
Inherited from WvrBaseComponent

A reference to the ThemeService

variantTypes
Type : []
Default value : []
Inherited from WvrBaseComponent
wvrBootstrap
Default value : true
Decorators :
@HostBinding('class.wvr-bootstrap')
Inherited from WvrBaseComponent

A host binding used to ensure the presense of the wvr-bootstrap class.

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;
  }
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""