define('@cardstack/tools/components/cs-collapsible-section', ['exports', '@cardstack/tools/templates/components/cs-collapsible-section'], function (exports, _csCollapsibleSection) {
  'use strict';

  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.default = Ember.Component.extend({
    layout: _csCollapsibleSection.default,
    tagName: 'section',
    classNameBindings: ['opened:opened:closed'],
    animationRules: animationRules,

    mouseEnter: function mouseEnter(event) {
      var hovered = this.get('hovered');
      if (hovered) {
        hovered(event);
      }
    },
    mouseLeave: function mouseLeave(event) {
      var unhovered = this.get('unhovered');
      if (unhovered) {
        unhovered(event);
      }
    },


    actions: {
      toggle: function toggle() {
        if (this.get('opened')) {
          this.get('close')();
        } else {
          this.get('open')();
        }
      }
    }
  });


  function animationRules() {
    this.transition(this.fromValue(false), this.toValue(true), this.use('to-down', { duration: 250 }), this.reverse('to-up', { duration: 250 }));
  }
});