<commit_before><h2>Defining Transition Animations</h2>

<p>Transitions are defined by creating a module like
<code>app/transitions/my-transition.js</code> that exports a
function. The function must return a Promise that resolves when the
transition is done.</p>

<p>The function has access to the current transition context via
<code>this</code>. The context includes:</p>

<dl class="dl-horizontal">
  <dt><code>oldElement</code></dt>

  <dd>The outgoing jQuery-wrapped element for this transition. It may
  be undefined when transitioning from an empty initial state, and it
  may become undefined if your transition gets interrupted.</dd>

  <dt><code>newElement</code></dt>

  <dd>The incoming jQuery-wrapped element for this transition. It may
  be undefined when transitioning into an empty state or if your
  transition gets interrupted.</dd>

  <dt><code>oldValue, newValue</code></dt>

  <dd>The corresponding values that go with your old and new states
  (this is the valued passed into a helper like
  <code>\{{liquid-bind}}</code>).</dd>

  <dt><code>oldView, newView</code></dt>

  <dd>The corresponding Ember View's that go with your old and new
    states.</dd>

  <dt><code>older</code></dt> <dd>If a running transition is interrupted before it
  finishes, you may have more than two active versions in the DOM at
  once. This is a list of those older versions, newest first. Each entry is an object with with the properties <code>{ element, value, view }</code>. </dd>

  <dt><code>lookup</code></dt> <dd>A function that allows you to
  lookup other transitions by name. This makes it easier to compose
  new transitions out of existing transitions. <code>this.lookup('other').apply(this).then(...)</code>.</dd>

</dl>


<p>Your transition can receive arguments directly from <code>use</code>
statements in transition rules. For example:</p>

{{code-snippet name="transition-arguments.js"}}<commit_msg>Note a snag re: custom transitions not being found<commit_after><h2>Defining Transition Animations</h2>

<p>Transitions are defined by creating a module like
<code>app/transitions/my-transition.js</code> that exports a
function. The function must return a Promise that resolves when the
transition is done.</p>

<p>The function has access to the current transition context via
<code>this</code>. The context includes:</p>

<dl class="dl-horizontal">
  <dt><code>oldElement</code></dt>

  <dd>The outgoing jQuery-wrapped element for this transition. It may
  be undefined when transitioning from an empty initial state, and it
  may become undefined if your transition gets interrupted.</dd>

  <dt><code>newElement</code></dt>

  <dd>The incoming jQuery-wrapped element for this transition. It may
  be undefined when transitioning into an empty state or if your
  transition gets interrupted.</dd>

  <dt><code>oldValue, newValue</code></dt>

  <dd>The corresponding values that go with your old and new states
  (this is the valued passed into a helper like
  <code>\{{liquid-bind}}</code>).</dd>

  <dt><code>oldView, newView</code></dt>

  <dd>The corresponding Ember View's that go with your old and new
    states.</dd>

  <dt><code>older</code></dt> <dd>If a running transition is interrupted before it
  finishes, you may have more than two active versions in the DOM at
  once. This is a list of those older versions, newest first. Each entry is an object with with the properties <code>{ element, value, view }</code>. </dd>

  <dt><code>lookup</code></dt> <dd>A function that allows you to
  lookup other transitions by name. This makes it easier to compose
  new transitions out of existing transitions. <code>this.lookup('other').apply(this).then(...)</code>.</dd>

</dl>


<p>Your transition can receive arguments directly from <code>use</code>
statements in transition rules. For example:</p>

{{code-snippet name="transition-arguments.js"}}

<p>Note: if your custom transition is not being found, restart your ember server ...</p>
{'fraction_non_alphanumeric': 0.11273644388398486, 'fraction_numerical': 0.001008827238335435, 'mean_word_length': 4.4930747922437675, 'pattern_counts': {'":': 0, '<': 121, '<?xml version=': 0, '>': 121, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4817761', 'n_tokens_mistral': 1130, 'n_tokens_neox': 1093, 'n_words': 471}