"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _create = _interopRequireDefault(require("../utils/create"));

var _unit = require("../utils/format/unit");

var _router = require("../utils/router");

var _relation = require("../mixins/relation");

var _info = _interopRequireDefault(require("../info"));

var _icon = _interopRequireDefault(require("../icon"));

// Mixins
// Components
var _default = (0, _create.default)({
  render: function render() {
    var _obj;

    var _vm = this;

    var _h = _vm.$createElement;

    var _c = _vm._self._c || _h;

    return _c('div', {
      class: [_vm.b({
        square: _vm.parents.square
      })],
      style: _vm.style
    }, [_c('div', {
      class: [_vm.b('content', [_vm.parents.direction, {
        center: _vm.parents.center,
        square: _vm.parents.square,
        clickable: _vm.parents.clickable,
        surround: _vm.parents.border && _vm.parents.gutter
      }]), (_obj = {}, _obj['vm-hairline'] = _vm.parents.border, _obj)],
      style: _vm.contentStyle,
      attrs: {
        "role": _vm.parents.clickable ? 'button' : null,
        "tabindex": _vm.parents.clickable ? 0 : null
      },
      on: {
        "click": _vm.onClick
      }
    }, [_vm._t("default", [_vm.$slots['icon'] ? _c('div', {
      class: _vm.b('icon-wrapper')
    }, [_vm._t("icon"), _c('Info', {
      attrs: {
        "dot": _vm.dot,
        "info": _vm.badge
      }
    })], 2) : _vm._e(), _vm.icon ? _c('Icon', {
      class: _vm.b('icon'),
      attrs: {
        "name": _vm.icon,
        "dot": _vm.dot,
        "badge": _vm.badge,
        "size": _vm.parents.iconSize,
        "classPrefix": _vm.iconPrefix
      }
    }) : _vm._e(), _vm._t("text", [_vm.text ? _c('span', {
      class: _vm.b('text')
    }, [_vm._v(_vm._s(_vm.text))]) : _vm._e()])])], 2)]);
  },
  components: {
    Info: _info.default,
    Icon: _icon.default
  },
  mixins: [(0, _relation.ChildrenMixin)("vmGrid")],
  name: "grid-item",
  props: (0, _extends2.default)({}, _router.routeProps, {
    dot: Boolean,
    text: String,
    icon: String,
    iconPrefix: String,
    badge: [Number, String]
  }),
  computed: {
    style: function style() {
      var _this$parents = this.parents,
          square = _this$parents.square,
          gutter = _this$parents.gutter,
          columnNum = _this$parents.columnNum;
      var percent = 100 / columnNum + "%";
      var style = {
        flexBasis: percent
      };

      if (square) {
        style.paddingTop = percent;
      } else if (gutter) {
        var gutterValue = (0, _unit.addUnit)(gutter);
        style.paddingRight = gutterValue;

        if (this.index >= columnNum) {
          style.marginTop = gutterValue;
        }
      }

      return style;
    },
    contentStyle: function contentStyle() {
      var _this$parents2 = this.parents,
          square = _this$parents2.square,
          gutter = _this$parents2.gutter;

      if (square && gutter) {
        var gutterValue = (0, _unit.addUnit)(gutter);
        return {
          right: gutterValue,
          bottom: gutterValue,
          height: "auto"
        };
      }
    }
  },
  methods: {
    onClick: function onClick(event) {
      this.$emit("click", event);
      (0, _router.route)(this.$router, this);
    }
  }
});

exports.default = _default;