@nutui/nutui 4.0.12-beta.1 → 4.0.12

package/dist/packages/_es/Navbar.js

@@ -1,16 +1,17 @@
-import { toRefs as T, ref as v, computed as C, onMounted as R, nextTick as z, resolveComponent as N, openBlock as l, createElementBlock as o, createElementVNode as r, normalizeClass as g, normalizeStyle as m, renderSlot as s, createVNode as w, createCommentVNode as a, toDisplayString as d } from "vue";
-import { c as V } from "./component-234624bc.js";
-import { Left as A } from "@nutui/icons-vue";
-import { _ as E } from "./_plugin-vue_export-helper-dad06003.js";
+import { toRefs, ref, computed, onMounted, nextTick, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot, createVNode, createCommentVNode, toDisplayString } from "vue";
+import { c as createComponent } from "./component-81a4c1d0.js";
+import { Left } from "@nutui/icons-vue";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
 import "../locale/lang";
-const { componentName: W, create: D } = V("navbar"), H = D({
-  components: { Left: A },
+const { componentName, create } = createComponent("navbar");
+const _sfc_main = create({
+  components: { Left },
   props: {
-    leftShow: { type: Boolean, default: !1 },
+    leftShow: { type: Boolean, default: false },
     //左侧  是否显示返回icon
     title: { type: String, default: "" },
     //中间  文字标题
-    titleIcon: { type: Boolean, default: !1 },
+    titleIcon: { type: Boolean, default: false },
     //中间
     leftText: { type: String, default: "" },
     //左侧文字
@@ -18,20 +19,20 @@ const { componentName: W, create: D } = V("navbar"), H = D({
     //右侧   按钮文字
     fixed: {
       type: Boolean,
-      default: !1
+      default: false
     },
     safeAreaInsetTop: {
       type: Boolean,
-      default: !1
+      default: false
     },
     border: {
       type: Boolean,
-      default: !1
+      default: false
     },
     placeholder: {
       // 生成一个等高的占位元素
       type: Boolean,
-      default: !0
+      default: true
     },
     zIndex: {
       type: [Number, String],
@@ -39,157 +40,172 @@ const { componentName: W, create: D } = V("navbar"), H = D({
     }
   },
   emits: ["on-click-back", "on-click-title", "on-click-icon", "on-click-right"],
-  setup(e, { emit: t }) {
-    const { border: h, fixed: p, safeAreaInsetTop: k, placeholder: c, zIndex: f } = T(e), n = v(null), u = v(null);
-    let y = v();
-    const b = C(() => {
-      const i = W;
+  setup(props, { emit }) {
+    const { border, fixed, safeAreaInsetTop, placeholder, zIndex } = toRefs(props);
+    const navBarWrap = ref(null);
+    const navBarHtml = ref(null);
+    let navHeight = ref();
+    const classes = computed(() => {
+      const prefixCls = componentName;
       return {
-        [i]: !0,
-        [`${i}--border`]: h.value,
-        [`${i}--fixed`]: p.value,
-        [`${i}--safe-area-inset-top`]: k.value
+        [prefixCls]: true,
+        [`${prefixCls}--border`]: border.value,
+        [`${prefixCls}--fixed`]: fixed.value,
+        [`${prefixCls}--safe-area-inset-top`]: safeAreaInsetTop.value
       };
-    }), I = C(() => ({
-      zIndex: f.value
-    }));
-    R(() => {
-      p.value && c.value && z(() => {
-        var i;
-        y.value = (i = u == null ? void 0 : u.value) == null ? void 0 : i.getBoundingClientRect().height, n.value.style.height = y.value + "px";
-      });
     });
-    function $() {
-      t("on-click-back");
+    const styles = computed(() => {
+      return {
+        zIndex: zIndex.value
+      };
+    });
+    onMounted(() => {
+      if (fixed.value && placeholder.value) {
+        nextTick(() => {
+          var _a;
+          navHeight.value = (_a = navBarHtml == null ? void 0 : navBarHtml.value) == null ? void 0 : _a.getBoundingClientRect().height;
+          navBarWrap.value.style.height = navHeight.value + "px";
+        });
+      }
+    });
+    function handleLeft() {
+      emit("on-click-back");
     }
-    function B() {
-      t("on-click-title");
+    function handleCenter() {
+      emit("on-click-title");
     }
-    function S() {
-      t("on-click-icon");
+    function handleCenterIcon() {
+      emit("on-click-icon");
     }
-    function L() {
-      t("on-click-right");
+    function handleRight() {
+      emit("on-click-right");
     }
     return {
-      navBarWrap: n,
-      navBarHtml: u,
-      classes: b,
-      styles: I,
-      handleLeft: $,
-      handleCenter: B,
-      handleCenterIcon: S,
-      handleRight: L
+      navBarWrap,
+      navBarHtml,
+      classes,
+      styles,
+      handleLeft,
+      handleCenter,
+      handleCenterIcon,
+      handleRight
     };
   }
-}), M = {
+});
+const _hoisted_1 = {
   key: 0,
   class: "nut-navbar--placeholder",
   ref: "navBarWrap"
-}, j = {
+};
+const _hoisted_2 = {
   key: 1,
   class: "nut-navbar__text"
-}, q = { class: "nut-navbar__title" }, F = {
+};
+const _hoisted_3 = { class: "nut-navbar__title" };
+const _hoisted_4 = {
   key: 0,
   class: "nut-navbar__text"
-}, G = {
+};
+const _hoisted_5 = {
   key: 1,
   class: "nut-navbar__text"
-}, J = { class: "nut-navbar__title" }, K = {
+};
+const _hoisted_6 = { class: "nut-navbar__title" };
+const _hoisted_7 = {
   key: 0,
   class: "nut-navbar__text"
 };
-function O(e, t, h, p, k, c) {
-  const f = N("Left");
-  return e.fixed && e.placeholder ? (l(), o("view", M, [
-    r("view", {
-      class: g(e.classes),
-      style: m(e.styles),
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Left = resolveComponent("Left");
+  return _ctx.fixed && _ctx.placeholder ? (openBlock(), createElementBlock("view", _hoisted_1, [
+    createElementVNode("view", {
+      class: normalizeClass(_ctx.classes),
+      style: normalizeStyle(_ctx.styles),
       ref: "navBarHtml"
     }, [
-      r("view", {
+      createElementVNode("view", {
         class: "nut-navbar__left",
-        onClick: t[0] || (t[0] = (...n) => e.handleLeft && e.handleLeft(...n))
+        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleLeft && _ctx.handleLeft(...args))
       }, [
-        e.leftShow ? s(e.$slots, "left-show", { key: 0 }, () => [
-          w(f, {
+        _ctx.leftShow ? renderSlot(_ctx.$slots, "left-show", { key: 0 }, () => [
+          createVNode(_component_Left, {
             height: "12px",
             color: "#979797"
           })
-        ]) : a("", !0),
-        e.leftText ? (l(), o("view", j, d(e.leftText), 1)) : a("", !0),
-        s(e.$slots, "left")
+        ]) : createCommentVNode("", true),
+        _ctx.leftText ? (openBlock(), createElementBlock("view", _hoisted_2, toDisplayString(_ctx.leftText), 1)) : createCommentVNode("", true),
+        renderSlot(_ctx.$slots, "left")
       ]),
-      r("view", q, [
-        e.title ? (l(), o("view", {
+      createElementVNode("view", _hoisted_3, [
+        _ctx.title ? (openBlock(), createElementBlock("view", {
           key: 0,
           class: "title",
-          onClick: t[1] || (t[1] = (...n) => e.handleCenter && e.handleCenter(...n))
-        }, d(e.title), 1)) : a("", !0),
-        e.titleIcon ? (l(), o("view", {
+          onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleCenter && _ctx.handleCenter(...args))
+        }, toDisplayString(_ctx.title), 1)) : createCommentVNode("", true),
+        _ctx.titleIcon ? (openBlock(), createElementBlock("view", {
           key: 1,
           class: "icon",
-          onClick: t[3] || (t[3] = (...n) => e.handleCenterIcon && e.handleCenterIcon(...n))
+          onClick: _cache[3] || (_cache[3] = (...args) => _ctx.handleCenterIcon && _ctx.handleCenterIcon(...args))
         }, [
-          s(e.$slots, "title-icon", {
-            onClick: t[2] || (t[2] = (...n) => e.handleCenterIcon && e.handleCenterIcon(...n))
+          renderSlot(_ctx.$slots, "title-icon", {
+            onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleCenterIcon && _ctx.handleCenterIcon(...args))
           })
-        ])) : a("", !0),
-        s(e.$slots, "content")
+        ])) : createCommentVNode("", true),
+        renderSlot(_ctx.$slots, "content")
       ]),
-      r("view", {
+      createElementVNode("view", {
         class: "nut-navbar__right",
-        onClick: t[4] || (t[4] = (...n) => e.handleRight && e.handleRight(...n))
+        onClick: _cache[4] || (_cache[4] = (...args) => _ctx.handleRight && _ctx.handleRight(...args))
       }, [
-        e.desc ? (l(), o("view", F, d(e.desc), 1)) : a("", !0),
-        s(e.$slots, "right")
+        _ctx.desc ? (openBlock(), createElementBlock("view", _hoisted_4, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
+        renderSlot(_ctx.$slots, "right")
       ])
     ], 6)
-  ], 512)) : (l(), o("view", {
+  ], 512)) : (openBlock(), createElementBlock("view", {
     key: 1,
-    class: g(e.classes),
-    style: m(e.styles)
+    class: normalizeClass(_ctx.classes),
+    style: normalizeStyle(_ctx.styles)
   }, [
-    r("view", {
+    createElementVNode("view", {
       class: "nut-navbar__left",
-      onClick: t[5] || (t[5] = (...n) => e.handleLeft && e.handleLeft(...n))
+      onClick: _cache[5] || (_cache[5] = (...args) => _ctx.handleLeft && _ctx.handleLeft(...args))
     }, [
-      e.leftShow ? s(e.$slots, "left-show", { key: 0 }, () => [
-        w(f, {
+      _ctx.leftShow ? renderSlot(_ctx.$slots, "left-show", { key: 0 }, () => [
+        createVNode(_component_Left, {
           height: "12px",
           color: "#979797"
         })
-      ]) : a("", !0),
-      e.leftText ? (l(), o("view", G, d(e.leftText), 1)) : a("", !0),
-      s(e.$slots, "left")
+      ]) : createCommentVNode("", true),
+      _ctx.leftText ? (openBlock(), createElementBlock("view", _hoisted_5, toDisplayString(_ctx.leftText), 1)) : createCommentVNode("", true),
+      renderSlot(_ctx.$slots, "left")
     ]),
-    r("view", J, [
-      e.title ? (l(), o("view", {
+    createElementVNode("view", _hoisted_6, [
+      _ctx.title ? (openBlock(), createElementBlock("view", {
         key: 0,
         class: "title",
-        onClick: t[6] || (t[6] = (...n) => e.handleCenter && e.handleCenter(...n))
-      }, d(e.title), 1)) : a("", !0),
-      e.titleIcon ? (l(), o("view", {
+        onClick: _cache[6] || (_cache[6] = (...args) => _ctx.handleCenter && _ctx.handleCenter(...args))
+      }, toDisplayString(_ctx.title), 1)) : createCommentVNode("", true),
+      _ctx.titleIcon ? (openBlock(), createElementBlock("view", {
         key: 1,
         class: "icon",
-        onClick: t[8] || (t[8] = (...n) => e.handleCenterIcon && e.handleCenterIcon(...n))
+        onClick: _cache[8] || (_cache[8] = (...args) => _ctx.handleCenterIcon && _ctx.handleCenterIcon(...args))
       }, [
-        s(e.$slots, "title-icon", {
-          onClick: t[7] || (t[7] = (...n) => e.handleCenterIcon && e.handleCenterIcon(...n))
+        renderSlot(_ctx.$slots, "title-icon", {
+          onClick: _cache[7] || (_cache[7] = (...args) => _ctx.handleCenterIcon && _ctx.handleCenterIcon(...args))
         })
-      ])) : a("", !0),
-      s(e.$slots, "content")
+      ])) : createCommentVNode("", true),
+      renderSlot(_ctx.$slots, "content")
     ]),
-    r("view", {
+    createElementVNode("view", {
       class: "nut-navbar__right",
-      onClick: t[9] || (t[9] = (...n) => e.handleRight && e.handleRight(...n))
+      onClick: _cache[9] || (_cache[9] = (...args) => _ctx.handleRight && _ctx.handleRight(...args))
     }, [
-      e.desc ? (l(), o("view", K, d(e.desc), 1)) : a("", !0),
-      s(e.$slots, "right")
+      _ctx.desc ? (openBlock(), createElementBlock("view", _hoisted_7, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
+      renderSlot(_ctx.$slots, "right")
     ])
   ], 6));
 }
-const Z = /* @__PURE__ */ E(H, [["render", O]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  Z as default
+  index as default
 };