zmp-vue/esm/zalo-ui-kits/card.js

Build full featured iOS & Android apps using ZMP & Vue

import { renderSlot as _renderSlot, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock, createVNode as _createVNode } from "vue";
var _hoisted_1 = {
  key: 0,
  class: "zmp-card-title"
};
var _hoisted_2 = {
  class: "zmp-card-body"
};

function render(_ctx, _cache) {
  return _openBlock(), _createBlock("div", {
    class: _ctx.classes,
    style: _ctx.style
  }, [_ctx.title || _ctx.$slots.title ? (_openBlock(), _createBlock("div", _hoisted_1, [_ctx.$slots.title ? _renderSlot(_ctx.$slots, "title", {
    key: 0
  }) : (_openBlock(), _createBlock(_Fragment, {
    key: 1
  }, [_createTextVNode(_toDisplayString(_ctx.title), 1)], 64))])) : _createCommentVNode("", true), _createVNode("div", _hoisted_2, [_renderSlot(_ctx.$slots, "default")])], 6);
}

import { computed } from 'vue';
import { classNames } from '../shared/utils';
export default {
  name: 'zmp-card',
  render: render,
  props: {
    inset: Boolean,
    title: String
  },
  setup: function setup(props) {
    var classes = computed(function () {
      return classNames('zmp-card', {
        'zmp-card-inset': props.inset
      });
    });
    return {
      classes: classes
    };
  }
};