Liquid Fire Hooks

Liquid-fire-hooks provides a didAnimateTransition component hook that is triggered on the closest component within the inserted DOM when a liquid-fire transition completes.

Support, Questions, Collaboration

Join the liquid-fire channel on Slack.

Status

Changelog

Usage

ember install liquid-fire-hooks

This will run the default blueprint which additionally installs liquid-fire.

didAnimateTransition

By default, only transitions utilizing the default transition will have didAnimateTransition triggered, to have a specific transition trigger the hook, you will need to use the with-hook transition.

How to use the with-hook

export default function() {
  this.transition(
    this.use('with-hook', 'to-right', { duration: 200 }),
    this.reverse('with-hook', 'to-left', { duration: 200 })
  );
}

The component will call the component's didAnimateTransition method first, if present. It will then trigger the didAnimateTransition event on the component.

Contributing

Contributions are very welcome.

When making a PR try to use the following conventions:

** Commit Messages: **

type(shortname): action based description

Examples:

• chore(deps): bump deps in package.json and bower.json
• docs(component): document the fast-action component

** Branch Naming: **

type/short-description

Examples:

• chore/bump-deps
• docs/fast-action-component