@vrx-arco/pro-layout
Version:
<p align="center"> <img src="https://vrx-arco.github.io/arco-design-pro/favicon.svg" width="200" height="250"> </p>
74 lines (73 loc) • 2.48 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const vue = require("vue");
const webVue = require("@arco-design/web-vue");
const use = require("@vrx-arco/use");
const IconMenuFold = require("@vrx-arco/icons-vue/IconMenuFold");
const _var = require("../../../style/var.js");
function _isSlot(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
}
const NavBar = /* @__PURE__ */ vue.defineComponent({
name: "vrx-arco-navBar",
props: {
logo: String,
title: String
},
emits: ["menuClick"],
setup: (props, {
slots,
emit
}) => {
const {
bemClass
} = _var.style("pro-layout-navbar");
const breakpoints = use.useShareBreakpoints();
const isSmallerLg = breakpoints.smaller("lg");
return () => {
var _a, _b, _c;
const {
logo
} = props;
const logoSlot = (_a = slots.logo) == null ? void 0 : _a.call(slots);
const logoContainerSlot = (_b = slots.logoContainer) == null ? void 0 : _b.call(slots);
const title = use.propsSlot(slots, props, "title");
const renderCenterContent = () => {
var _a2;
const content = (_a2 = slots.content) == null ? void 0 : _a2.call(slots);
if (content) {
return vue.createVNode("div", {
"class": bemClass("__center-content")
}, [content]);
}
};
return vue.createVNode("div", {
"class": bemClass()
}, [vue.createVNode("div", {
"class": bemClass("__left-side")
}, [logoContainerSlot || vue.createVNode(webVue.Space, {
"direction": "horizontal"
}, {
default: () => [logoSlot || vue.createVNode("img", {
"alt": "logo",
"src": logo
}, null), isSmallerLg.value || vue.createVNode(webVue.TypographyTitle, {
"style": {
margin: 0,
fontSize: "18px"
},
"heading": 5
}, _isSlot(title) ? title : {
default: () => [title]
})]
}), isSmallerLg.value && vue.createVNode(IconMenuFold, vue.mergeProps({
"class": ["arco-icon", bemClass("__left-side--smaller")]
}, {
onClick: () => emit("menuClick")
}), null)]), renderCenterContent(), vue.createVNode("div", {
"class": bemClass("__right-side")
}, [(_c = slots.default) == null ? void 0 : _c.call(slots)])]);
};
}
});
exports.NavBar = NavBar;