zmp-vue/cjs/components/block.js

Build full featured iOS & Android apps using ZMP & Vue

"use strict";

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

var _vue = require("vue");

var _utils = require("../shared/utils");

var _mixins = require("../shared/mixins");

var _useTab = require("../shared/use-tab");

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function render(_ctx, _cache) {
  return (0, _vue.openBlock)(), (0, _vue.createBlock)("div", {
    ref: "elRef",
    class: _ctx.classes
  }, [(0, _vue.renderSlot)(_ctx.$slots, "default")], 2);
}

var _default = {
  name: 'zmp-block',
  render: render,
  props: _extends({
    inset: Boolean,
    xsmallInset: Boolean,
    smallInset: Boolean,
    mediumInset: Boolean,
    largeInset: Boolean,
    xlargeInset: Boolean,
    strong: Boolean,
    tabs: Boolean,
    tab: Boolean,
    tabActive: Boolean,
    accordionList: Boolean,
    accordionOpposite: Boolean,
    noHairlines: Boolean,
    noHairlinesMd: Boolean,
    noHairlinesIos: Boolean,
    noHairlinesAurora: Boolean
  }, _mixins.colorProps),
  emits: ['tab:hide', 'tab:show'],
  setup: function setup(props, _ref) {
    var emit = _ref.emit;
    var elRef = (0, _vue.ref)(null);
    (0, _useTab.useTab)(elRef, emit);
    var classes = (0, _vue.computed)(function () {
      var inset = props.inset,
          xsmallInset = props.xsmallInset,
          smallInset = props.smallInset,
          mediumInset = props.mediumInset,
          largeInset = props.largeInset,
          xlargeInset = props.xlargeInset,
          strong = props.strong,
          accordionList = props.accordionList,
          accordionOpposite = props.accordionOpposite,
          tabs = props.tabs,
          tab = props.tab,
          tabActive = props.tabActive,
          noHairlines = props.noHairlines,
          noHairlinesMd = props.noHairlinesMd,
          noHairlinesIos = props.noHairlinesIos,
          noHairlinesAurora = props.noHairlinesAurora;
      return (0, _utils.classNames)('block', {
        inset: inset,
        'xsmall-inset': xsmallInset,
        'small-inset': smallInset,
        'medium-inset': mediumInset,
        'large-inset': largeInset,
        'xlarge-inset': xlargeInset,
        'block-strong': strong,
        'accordion-list': accordionList,
        'accordion-opposite': accordionOpposite,
        tabs: tabs,
        tab: tab,
        'tab-active': tabActive,
        'no-hairlines': noHairlines,
        'no-hairlines-md': noHairlinesMd,
        'no-hairlines-ios': noHairlinesIos,
        'no-hairlines-aurora': noHairlinesAurora
      }, (0, _mixins.colorClasses)(props));
    });
    return {
      elRef: elRef,
      classes: classes
    };
  }
};
exports.default = _default;