"use strict";

exports.__esModule = true;
exports.default = createCollapseTransition;

var _dom = require("./dom");

require("../styles/transitions/collapse.css");

// from: https://github.com/ElemeFE/element/blob/dev/src/transitions/collapse-transition.js
function createCollapseTransition() {
  var dataset;
  return {
    beforeEnter(el) {
      (0, _dom.addClass)(el, 'collapse-transition');

      if (!dataset) {
        dataset = {};
        dataset.oldPaddingTop = el.style.paddingTop;
        dataset.oldPaddingBottom = el.style.paddingBottom;
        dataset.oldOverflow = el.style.overflow;
      }

      el.style.height = '0';
      el.style.paddingTop = 0;
      el.style.paddingBottom = 0;
    },

    enter(el) {
      if (el.scrollHeight !== 0) {
        el.style.height = el.scrollHeight + 'px';
        el.style.paddingTop = dataset.oldPaddingTop;
        el.style.paddingBottom = dataset.oldPaddingBottom;
      } else {
        el.style.height = '';
        el.style.paddingTop = dataset.oldPaddingTop;
        el.style.paddingBottom = dataset.oldPaddingBottom;
      }

      el.style.overflow = 'hidden';
    },

    afterEnter(el) {
      // for safari: remove class then reset height is necessary
      if (status !== 'afterEnter') return;
      (0, _dom.removeClass)(el, 'collapse-transition');
      el.style.height = '';
      el.style.overflow = dataset.oldOverflow;
    },

    beforeLeave(el) {
      if (!dataset) {
        dataset = {};
        dataset.oldPaddingTop = el.style.paddingTop;
        dataset.oldPaddingBottom = el.style.paddingBottom;
        dataset.oldOverflow = el.style.overflow;
      }

      el.style.height = el.scrollHeight + 'px';
      el.style.overflow = 'hidden';
    },

    leave(el) {
      if (el.scrollHeight !== 0) {
        // for safari: add class after set height, or it will jump to zero height suddenly, weired
        (0, _dom.addClass)(el, 'collapse-transition');
        el.style.height = 0;
        el.style.paddingTop = 0;
        el.style.paddingBottom = 0;
      }
    },

    afterLeave(el) {
      (0, _dom.removeClass)(el, 'collapse-transition');
      el.style.height = '';
      el.style.overflow = dataset.oldOverflow;
      el.style.paddingTop = dataset.oldPaddingTop;
      el.style.paddingBottom = dataset.oldPaddingBottom;
    }

  };
}

;