Provided Mixins

mubanTransitionMixin

This mixin extends the mubanTransitionCoreMixin.

Methods:

After extending this mixin a couple of methods are added to your component, you can see all of them in the generated documentation. See below for the most common ones!

transitionIn

• Description: This method allows you to trigger a transitionIn on your component.
• Parameters
  • forceTransition
    • type: boolean
    • required: false
    • description: If you trigger a transitionIn when the transitionOut is still running by default it will wait for the transitionOut to be complete, if you provide this flag it will force your new transition.
• Returns
  • Promise<void>

transitionOut

• Description: This method allows you to trigger a transitionOut on your component.
• Parameters
  • forceTransition
    • type: boolean
    • required: false
    • description: If you trigger a transitionOut when the transitionIn is still running by default it will wait for the transitionIn to be complete, if you provide this flag it will force your new transiton.
• Returns
  • Promise<void>

enterView

• Description: This method is triggered when a data-scroll-component component enters the view.
• Returns
  • <void>

leaveView

• Description: This method is triggered when a data-scroll-component component leaves the view.
• Returns
  • <void>

beyondView

• Description: This method is triggered when the scrollbar is dragged down super fast the default enter view event might not be triggered therefor we have a beyondView event! If it's already transitioned in it will do nothing! But if it's not transitioned in it will still try to transitionIn
• Returns
  • <void>

startLoopingAnimation

• Description: Starts the loopingAnimation timeline for the component
• Returns
  • <void>

stopLoopingAnimation

• Description: Stops the loopingAnimation timeline for the component
• Returns
  • <void>

Properties

After extending this mixin a couple of properties are added to your component, you can see all of them in the generated documentation. See below for the most common ones!

enterViewThreshold

• Type: number
• Description: Contains a number between 0 - 1. Setting this number to for example 0.5 will trigger the enterView method when the data-scroll-component component is already visible for 50% within your viewport.

transitionController

• Description: The transition controller for the component

mubanTransitionCoreMixin

This extends the coreComponent

Properties:

After extending this mixin a couple of properties are added to your component, you can see all of them in the generated documentation. See below for the most common ones!

eventNamespace

• Type: string
• Description: contains a namespace

disposable

• Type: string
• Description: Contains a disposable-helper, utility class for handling various destructible things like timeouts, promises, disposable-events, etc.

dispatcher

• Type: EventDispatcher
• Description: Base class that adds the ability to dispatch events and attach handlers that should becalled when such events are triggered. seng-event

displayName:

• Type: string
• Description: Contains the name of the component

componentId:

• Type: string
• Description: Contains a unique id, combination of displayName and eventNamespace