zmp-vue/esm/zalo-ui-kits/nav-left.js

Build full featured iOS & Android apps using ZMP & Vue

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); }

import { resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, mergeProps as _mergeProps, withCtx as _withCtx } from "vue";

function render(_ctx, _cache) {
  var _component_Link = _resolveComponent("Link");

  var _component_NavLeft = _resolveComponent("NavLeft");

  return _openBlock(), _createBlock(_component_NavLeft, _mergeProps(_extends({}, _ctx.$props, _ctx.$attrs), {
    backLink: false
  }), {
    default: _withCtx(function () {
      return [_ctx.backLink ? (_openBlock(), _createBlock(_component_Link, {
        key: 0,
        back: "",
        href: _ctx.backLinkUrl || '#',
        "no-link-class": "",
        "icon-zmp": _ctx.ICON_CHEVRON_LEFT,
        force: _ctx.backLinkForce || undefined,
        class: _ctx.classes,
        text: _ctx.backLink !== true && _ctx.backLinkShowText ? _ctx.backLink : undefined,
        onClick: _cache[1] || (_cache[1] = function ($event) {
          _ctx.$emit('click:back', $event);

          _ctx.$emit('click:back', $event);
        })
      }, null, 8, ["href", "icon-zmp", "force", "class", "text"])) : _createCommentVNode("", true), _renderSlot(_ctx.$slots, "default")];
    }),
    _: 3
  }, 16);
}

import { computed } from 'vue';
import { ICON_CHEVRON_LEFT } from '../../common/constants';
import NavLeft from '../components/nav-left';
import Link from '../components/link';
import { colorProps, colorClasses } from '../shared/mixins';
import { classNames } from '../shared/utils';
export default {
  name: 'zmp-nav-left',
  render: render,
  components: {
    NavLeft: NavLeft,
    Link: Link
  },
  props: _extends({
    backLink: [Boolean, String],
    backLinkUrl: String,
    backLinkForce: Boolean,
    backLinkShowText: Boolean,
    sliding: Boolean
  }, colorProps),
  emits: ['click:back', 'click:back'],
  setup: function setup(props) {
    var classes = computed(function () {
      return classNames({
        'icon-only': !props.text,
        'no-ripple': !props.text
      }, colorClasses(props));
    });
    return {
      classes: classes,
      ICON_CHEVRON_LEFT: ICON_CHEVRON_LEFT
    };
  }
};