@nutui/nutui 4.1.0-beta.6 → 4.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/CHANGELOG.md +46 -0
  2. package/README.md +27 -70
  3. package/dist/nutui.es.js +4 -2
  4. package/dist/nutui.js +5140 -5134
  5. package/dist/nutui.umd.js +1 -1
  6. package/dist/packages/_es/Animate.js +37 -39
  7. package/dist/packages/_es/Card.js +26 -27
  8. package/dist/packages/_es/CircleProgress.js +8 -17
  9. package/dist/packages/_es/Empty.js +26 -29
  10. package/dist/packages/_es/Indicator.js +17 -18
  11. package/dist/packages/_es/Navbar.js +41 -88
  12. package/dist/packages/_es/Price.js +2 -2
  13. package/dist/packages/_es/Progress.js +20 -23
  14. package/dist/packages/_es/Sticky.js +4 -0
  15. package/dist/packages/_es/Swipe.js +64 -39
  16. package/dist/packages/_es/SwipeGroup.js +39 -0
  17. package/dist/packages/_es/Tabs.js +8 -3
  18. package/dist/packages/_es/Tag.js +30 -25
  19. package/dist/packages/_es/Uploader.js +52 -53
  20. package/dist/packages/button/index.scss +14 -0
  21. package/dist/packages/navbar/index.scss +1 -0
  22. package/dist/packages/progress/index.scss +6 -0
  23. package/dist/packages/swipe/index.scss +1 -0
  24. package/dist/packages/swipegroup/index.mjs +4 -0
  25. package/dist/packages/swipegroup/index.scss +0 -0
  26. package/dist/packages/swipegroup/style.mjs +2 -0
  27. package/dist/smartips/web-types.json +158 -23
  28. package/dist/style.css +1 -1
  29. package/dist/styles/themes/default.scss +56 -55
  30. package/dist/styles/themes/jdb.scss +56 -55
  31. package/dist/styles/themes/jddkh.scss +56 -55
  32. package/dist/styles/themes/jdt.scss +56 -55
  33. package/dist/types/__VUE/animate/index.vue.d.ts +14 -3
  34. package/dist/types/__VUE/animate/type.d.ts +1 -1
  35. package/dist/types/__VUE/card/index.vue.d.ts +22 -3
  36. package/dist/types/__VUE/circleprogress/index.vue.d.ts +7 -10
  37. package/dist/types/__VUE/circleprogress/types.d.ts +1 -0
  38. package/dist/types/__VUE/empty/index.vue.d.ts +11 -4
  39. package/dist/types/__VUE/empty/types.d.ts +1 -0
  40. package/dist/types/__VUE/indicator/index.vue.d.ts +7 -9
  41. package/dist/types/__VUE/indicator/types.d.ts +1 -0
  42. package/dist/types/__VUE/navbar/index.vue.d.ts +8 -5
  43. package/dist/types/__VUE/price/index.vue.d.ts +8 -6
  44. package/dist/types/__VUE/price/types.d.ts +2 -0
  45. package/dist/types/__VUE/progress/index.vue.d.ts +10 -10
  46. package/dist/types/__VUE/progress/types.d.ts +2 -0
  47. package/dist/types/__VUE/swipe/index.vue.d.ts +4 -4
  48. package/dist/types/__VUE/swipegroup/index.vue.d.ts +26 -0
  49. package/dist/types/__VUE/tag/index.vue.d.ts +5 -4
  50. package/dist/types/__VUE/uploader/index.vue.d.ts +40 -7
  51. package/dist/types/index.d.ts +3 -2
  52. package/dist/types/utils/unit.d.ts +1 -0
  53. package/dist/types/utils/useTaroRect/index.d.ts +1 -0
  54. package/package.json +1 -1
  55. /package/dist/types/__VUE/tag/{type.d.ts → types.d.ts} +0 -0
@@ -1,69 +1,67 @@
1
- var __defProp = Object.defineProperty;
2
- var __defProps = Object.defineProperties;
3
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
- var __spreadValues = (a, b) => {
9
- for (var prop in b || (b = {}))
10
- if (__hasOwnProp.call(b, prop))
11
- __defNormalProp(a, prop, b[prop]);
12
- if (__getOwnPropSymbols)
13
- for (var prop of __getOwnPropSymbols(b)) {
14
- if (__propIsEnum.call(b, prop))
15
- __defNormalProp(a, prop, b[prop]);
16
- }
17
- return a;
18
- };
19
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
- import { toRefs, reactive, computed, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
1
+ import { ref, computed, watch, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
21
2
  import { c as createComponent } from "./component-0fbad28e.js";
22
3
  import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
23
4
  import "../locale/lang";
24
- const { componentName, create } = createComponent("animate");
5
+ const { create } = createComponent("animate");
25
6
  const _sfc_main = create({
26
7
  props: {
27
8
  type: {
28
9
  type: String,
29
10
  default: ""
30
11
  },
12
+ show: {
13
+ type: Boolean,
14
+ defualt: false
15
+ },
31
16
  action: {
32
17
  type: String,
33
- default: "initial"
18
+ default: ""
34
19
  },
35
20
  loop: {
36
21
  type: Boolean,
37
22
  default: false
38
23
  },
39
24
  duration: {
40
- type: [String, Number]
25
+ type: [String, Number],
26
+ defualt: 500
41
27
  }
42
28
  },
43
- emits: ["click"],
29
+ emits: ["click", "animate"],
44
30
  setup(props, { emit }) {
45
- const { type, loop, action } = toRefs(props);
46
- const state = reactive({
47
- clicked: false
48
- });
49
- let classes = computed(() => {
50
- const prefixCls = componentName;
31
+ const animated = ref(props.action === "initial" || props.show === true || props.loop);
32
+ const classes = computed(() => {
33
+ const prefixCls = "nut-animate";
51
34
  return {
52
35
  "nut-animate__container": true,
53
- [`${prefixCls}-${type.value}`]: action.value === "initial" || state.clicked ? type.value : false,
54
- loop: loop.value
36
+ [`${prefixCls}-${props.type}`]: animated.value,
37
+ loop: props.loop
55
38
  };
56
39
  });
40
+ const animate = () => {
41
+ animated.value = false;
42
+ requestAnimationFrame(() => {
43
+ requestAnimationFrame(() => {
44
+ animated.value = true;
45
+ });
46
+ });
47
+ };
57
48
  const handleClick = (event) => {
58
- state.clicked = true;
59
- if (!loop.value) {
60
- setTimeout(() => {
61
- state.clicked = false;
62
- }, 1e3);
49
+ if (props.action === "click") {
50
+ animate();
51
+ emit("click", event);
52
+ emit("animate");
63
53
  }
64
- emit("click", event);
65
54
  };
66
- return __spreadProps(__spreadValues({}, toRefs(state)), { classes, handleClick });
55
+ watch(
56
+ () => props.show,
57
+ (val) => {
58
+ if (val) {
59
+ animate();
60
+ emit("animate");
61
+ }
62
+ }
63
+ );
64
+ return { classes, handleClick };
67
65
  }
68
66
  });
69
67
  const _hoisted_1 = { class: "nut-animate" };
@@ -1,5 +1,5 @@
1
1
  import { c as createComponent } from "./component-0fbad28e.js";
2
- import { resolveComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, renderSlot, createBlock, createCommentVNode, Fragment, createVNode, withCtx, createTextVNode } from "vue";
2
+ import { resolveComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, renderSlot, createVNode, createCommentVNode, withCtx, createTextVNode } from "vue";
3
3
  import Price from "./Price.js";
4
4
  import Tag from "./Tag.js";
5
5
  import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
@@ -13,38 +13,37 @@ const _sfc_main = create({
13
13
  },
14
14
  props: {
15
15
  imgUrl: {
16
- type: String
16
+ type: String,
17
+ default: ""
17
18
  },
18
19
  title: {
19
- type: String
20
+ type: String,
21
+ default: ""
20
22
  },
21
23
  price: {
22
- type: String
24
+ type: String,
25
+ default: ""
23
26
  },
24
27
  vipPrice: {
25
- type: String
28
+ type: String,
29
+ default: ""
26
30
  },
27
31
  shopDesc: {
28
- type: String
32
+ type: String,
33
+ default: ""
29
34
  },
30
35
  delivery: {
31
- type: String
36
+ type: String,
37
+ default: ""
32
38
  },
33
39
  shopName: {
34
- type: String
40
+ type: String,
41
+ default: ""
35
42
  },
36
43
  isNeedPrice: {
37
44
  type: Boolean,
38
45
  default: true
39
46
  }
40
- },
41
- setup(props, { slots }) {
42
- const isHaveSlot = (slot) => {
43
- return slots[slot];
44
- };
45
- return {
46
- isHaveSlot
47
- };
48
47
  }
49
48
  });
50
49
  const _hoisted_1 = { class: "nut-card" };
@@ -73,18 +72,18 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
73
72
  createElementVNode("div", _hoisted_5, toDisplayString(_ctx.title), 1),
74
73
  renderSlot(_ctx.$slots, "prolist"),
75
74
  _ctx.isNeedPrice ? (openBlock(), createElementBlock("div", _hoisted_6, [
76
- _ctx.isHaveSlot("price") ? renderSlot(_ctx.$slots, "price", { key: 0 }) : (openBlock(), createBlock(_component_nut_price, {
77
- key: 1,
78
- price: _ctx.price
79
- }, null, 8, ["price"])),
80
- _ctx.isHaveSlot("origin") ? renderSlot(_ctx.$slots, "origin", { key: 2 }) : (openBlock(), createBlock(_component_nut_price, {
81
- key: 3,
82
- class: "nut-card__right__price__origin",
83
- price: _ctx.vipPrice
84
- }, null, 8, ["price"]))
75
+ renderSlot(_ctx.$slots, "price", {}, () => [
76
+ createVNode(_component_nut_price, { price: _ctx.price }, null, 8, ["price"])
77
+ ]),
78
+ renderSlot(_ctx.$slots, "origin", {}, () => [
79
+ createVNode(_component_nut_price, {
80
+ class: "nut-card__right__price__origin",
81
+ price: _ctx.vipPrice
82
+ }, null, 8, ["price"])
83
+ ])
85
84
  ])) : createCommentVNode("", true),
86
85
  createElementVNode("div", _hoisted_7, [
87
- _ctx.isHaveSlot("shop-tag") ? renderSlot(_ctx.$slots, "shop-tag", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
86
+ renderSlot(_ctx.$slots, "shop-tag", {}, () => [
88
87
  createVNode(_component_nut_tag, { type: "danger" }, {
89
88
  default: withCtx(() => [
90
89
  createTextVNode(toDisplayString(_ctx.shopDesc), 1)
@@ -97,7 +96,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
97
96
  ]),
98
97
  _: 1
99
98
  })
100
- ], 64))
99
+ ])
101
100
  ]),
102
101
  createElementVNode("div", _hoisted_8, [
103
102
  createElementVNode("div", _hoisted_9, toDisplayString(_ctx.shopName), 1),
@@ -1,13 +1,13 @@
1
- import { useSlots, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, Fragment, renderList, renderSlot, toDisplayString, createCommentVNode } from "vue";
1
+ import { computed, openBlock, createElementBlock, normalizeStyle, createElementVNode, Fragment, renderList, renderSlot, toDisplayString } from "vue";
2
2
  import { h as isObject, c as createComponent } from "./component-0fbad28e.js";
3
3
  import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
4
4
  import "../locale/lang";
5
- const { componentName, create } = createComponent("circle-progress");
5
+ const { create } = createComponent("circle-progress");
6
6
  const _sfc_main = create({
7
7
  props: {
8
8
  progress: {
9
9
  type: [Number, String],
10
- required: true
10
+ defualt: 0
11
11
  },
12
12
  strokeWidth: {
13
13
  type: [Number, String],
@@ -35,14 +35,7 @@ const _sfc_main = create({
35
35
  }
36
36
  },
37
37
  setup(props) {
38
- const slotDefault = !!useSlots().default;
39
38
  const refRandomId = Math.random().toString(36).slice(-8);
40
- const classes = computed(() => {
41
- const prefixCls = componentName;
42
- return {
43
- [prefixCls]: true
44
- };
45
- });
46
39
  const path = computed(() => {
47
40
  const isWise = props.clockwise ? 1 : 0;
48
41
  return `M 50 50 m 0 -45 a 45 45 0 1 ${isWise} 0 90 a 45 45 0 1, ${isWise} 0 -90`;
@@ -82,13 +75,11 @@ const _sfc_main = create({
82
75
  return stopArr;
83
76
  });
84
77
  return {
85
- classes,
86
78
  hoverStyle,
87
79
  pathStyle,
88
80
  path,
89
81
  hoverColor,
90
82
  stop,
91
- slotDefault,
92
83
  refRandomId
93
84
  };
94
85
  }
@@ -99,10 +90,9 @@ const _hoisted_3 = ["offset", "stop-color"];
99
90
  const _hoisted_4 = ["d", "stroke-width"];
100
91
  const _hoisted_5 = ["d", "stroke", "stroke-linecap", "stroke-width"];
101
92
  const _hoisted_6 = { class: "nut-circle-progress__text" };
102
- const _hoisted_7 = { key: 0 };
103
93
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
104
94
  return openBlock(), createElementBlock("div", {
105
- class: normalizeClass(_ctx.classes),
95
+ class: "nut-circle-progress",
106
96
  style: normalizeStyle({ height: Number(_ctx.radius) * 2 + "px", width: Number(_ctx.radius) * 2 + "px" })
107
97
  }, [
108
98
  (openBlock(), createElementBlock("svg", _hoisted_1, [
@@ -141,10 +131,11 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
141
131
  }, null, 12, _hoisted_5)
142
132
  ])),
143
133
  createElementVNode("div", _hoisted_6, [
144
- renderSlot(_ctx.$slots, "default"),
145
- !_ctx.slotDefault ? (openBlock(), createElementBlock("div", _hoisted_7, toDisplayString(_ctx.progress) + "%", 1)) : createCommentVNode("", true)
134
+ renderSlot(_ctx.$slots, "default", {}, () => [
135
+ createElementVNode("div", null, toDisplayString(_ctx.progress) + "%", 1)
136
+ ])
146
137
  ])
147
- ], 6);
138
+ ], 4);
148
139
  }
149
140
  const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
150
141
  export {
@@ -1,5 +1,6 @@
1
- import { toRefs, computed, openBlock, createElementBlock, createElementVNode, normalizeStyle, renderSlot, Fragment, createCommentVNode, toDisplayString } from "vue";
1
+ import { computed, openBlock, createElementBlock, createElementVNode, normalizeStyle, renderSlot, createCommentVNode, toDisplayString } from "vue";
2
2
  import { c as createComponent } from "./component-0fbad28e.js";
3
+ import { p as pxCheck } from "./pxCheck-c6b9f6b7.js";
3
4
  import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
4
5
  import "../locale/lang";
5
6
  const { create, translate } = createComponent("empty");
@@ -13,61 +14,57 @@ const _sfc_main = create({
13
14
  image: {
14
15
  type: String,
15
16
  default: "empty"
16
- //默认empty
17
17
  },
18
18
  imageSize: {
19
19
  type: [Number, String],
20
- // 图片大小,正方形
21
20
  default: ""
22
21
  },
23
22
  description: {
24
23
  type: String,
25
- // 文字区
26
24
  default: ""
27
25
  }
28
26
  },
29
27
  setup(props) {
30
- const { image, imageSize } = toRefs(props);
31
- const imgStyle = computed(() => {
32
- if (!imageSize.value) {
33
- return "";
28
+ const style = computed(() => {
29
+ if (props.imageSize) {
30
+ return {
31
+ width: pxCheck(props.imageSize),
32
+ height: pxCheck(props.imageSize)
33
+ };
34
34
  }
35
- if (typeof imageSize.value === "number") {
36
- return `width:${imageSize.value}px;height:${imageSize.value}px`;
35
+ return {};
36
+ });
37
+ const src = computed(() => {
38
+ if (props.image.startsWith("https://") || props.image.startsWith("http://") || props.image.startsWith("//")) {
39
+ return props.image;
40
+ } else {
41
+ return defaultStatus[props.image];
37
42
  }
38
- return `width:${imageSize.value};height:${imageSize.value}`;
39
43
  });
40
- const isHttpUrl = image.value.startsWith("https://") || image.value.startsWith("http://") || image.value.startsWith("//");
41
- const imageUrl = isHttpUrl ? image.value : defaultStatus[image.value];
42
- return {
43
- imageUrl,
44
- imgStyle,
45
- translate
46
- };
44
+ return { src, style, translate };
47
45
  }
48
46
  });
49
47
  const _hoisted_1 = { class: "nut-empty" };
50
48
  const _hoisted_2 = ["src"];
51
- const _hoisted_3 = {
52
- key: 1,
53
- class: "nut-empty__description"
54
- };
49
+ const _hoisted_3 = { class: "nut-empty__description" };
55
50
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
56
51
  return openBlock(), createElementBlock("view", _hoisted_1, [
57
52
  createElementVNode("view", {
58
53
  class: "nut-empty__box",
59
- style: normalizeStyle(_ctx.imgStyle)
54
+ style: normalizeStyle(_ctx.style)
60
55
  }, [
61
- _ctx.$slots.image ? renderSlot(_ctx.$slots, "image", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
62
- _ctx.imageUrl ? (openBlock(), createElementBlock("img", {
56
+ renderSlot(_ctx.$slots, "image", {}, () => [
57
+ _ctx.src ? (openBlock(), createElementBlock("img", {
63
58
  key: 0,
64
59
  class: "nut-empty__box--img",
65
- src: _ctx.imageUrl
60
+ src: _ctx.src
66
61
  }, null, 8, _hoisted_2)) : createCommentVNode("", true)
67
- ], 64))
62
+ ])
68
63
  ], 4),
69
- _ctx.$slots.description ? renderSlot(_ctx.$slots, "description", { key: 0 }) : (openBlock(), createElementBlock("view", _hoisted_3, toDisplayString(_ctx.description || _ctx.translate("noData")), 1)),
70
- _ctx.$slots.default ? renderSlot(_ctx.$slots, "default", { key: 2 }) : createCommentVNode("", true)
64
+ renderSlot(_ctx.$slots, "description", {}, () => [
65
+ createElementVNode("view", _hoisted_3, toDisplayString(_ctx.description || _ctx.translate("noData")), 1)
66
+ ]),
67
+ renderSlot(_ctx.$slots, "default")
71
68
  ]);
72
69
  }
73
70
  const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
@@ -1,19 +1,17 @@
1
- import { toRefs, computed, openBlock, createElementBlock, normalizeClass, Fragment, renderList, toDisplayString } from "vue";
1
+ import { computed, openBlock, createElementBlock, normalizeClass, Fragment, renderList, toDisplayString } from "vue";
2
2
  import { p as padZero, c as createComponent } from "./component-0fbad28e.js";
3
3
  import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
4
4
  import "../locale/lang";
5
- const { componentName, create } = createComponent("indicator");
5
+ const { create } = createComponent("indicator");
6
6
  const _sfc_main = create({
7
7
  props: {
8
8
  size: {
9
9
  type: Number,
10
- default: 3,
11
- required: true
10
+ default: 3
12
11
  },
13
12
  current: {
14
13
  type: Number,
15
- default: 1,
16
- required: true
14
+ default: 1
17
15
  },
18
16
  block: {
19
17
  type: Boolean,
@@ -29,31 +27,32 @@ const _sfc_main = create({
29
27
  }
30
28
  },
31
29
  setup(props) {
32
- const { block, align } = toRefs(props);
33
30
  const classes = computed(() => {
34
- const prefixCls = componentName;
31
+ const prefixCls = "nut-indicator";
35
32
  return {
36
33
  [prefixCls]: true,
37
- [`${prefixCls}--block`]: block.value,
38
- [`${prefixCls}--align__${align.value}`]: block.value && align.value
34
+ [`${prefixCls}--block`]: props.block,
35
+ [`${prefixCls}--align__${props.align}`]: props.block && props.align
39
36
  };
40
37
  });
41
- return { classes, componentName, padZero };
38
+ return { classes, padZero };
42
39
  }
43
40
  });
41
+ const _hoisted_1 = {
42
+ key: 0,
43
+ class: "nut-indicator--number"
44
+ };
45
+ const _hoisted_2 = {
46
+ key: 1,
47
+ class: "nut-indicator--dot"
48
+ };
44
49
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
45
50
  return openBlock(), createElementBlock("view", {
46
51
  class: normalizeClass(_ctx.classes)
47
52
  }, [
48
53
  (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.size, (item) => {
49
54
  return openBlock(), createElementBlock(Fragment, { key: item }, [
50
- item === _ctx.current ? (openBlock(), createElementBlock("view", {
51
- key: 0,
52
- class: normalizeClass(`${_ctx.componentName}--number`)
53
- }, toDisplayString(_ctx.fillZero && _ctx.padZero(item) || item), 3)) : (openBlock(), createElementBlock("view", {
54
- key: 1,
55
- class: normalizeClass(`${_ctx.componentName}--dot`)
56
- }, null, 2))
55
+ item === _ctx.current ? (openBlock(), createElementBlock("view", _hoisted_1, toDisplayString(_ctx.fillZero && _ctx.padZero(item) || item), 1)) : (openBlock(), createElementBlock("view", _hoisted_2))
57
56
  ], 64);
58
57
  }), 128))
59
58
  ], 2);
@@ -1,4 +1,4 @@
1
- import { toRefs, ref, computed, onMounted, nextTick, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot, createVNode, createCommentVNode, toDisplayString } from "vue";
1
+ import { toRefs, ref, computed, onMounted, nextTick, resolveComponent, openBlock, createElementBlock, normalizeStyle, createElementVNode, normalizeClass, renderSlot, createVNode, createCommentVNode, toDisplayString } from "vue";
2
2
  import { c as createComponent } from "./component-0fbad28e.js";
3
3
  import { Left } from "@nutui/icons-vue";
4
4
  import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
@@ -41,10 +41,9 @@ const _sfc_main = create({
41
41
  },
42
42
  emits: ["on-click-back", "on-click-title", "on-click-icon", "on-click-right"],
43
43
  setup(props, { emit }) {
44
- const { border, fixed, safeAreaInsetTop, placeholder, zIndex } = toRefs(props);
45
- const navBarWrap = ref(null);
46
- const navBarHtml = ref(null);
47
- let navHeight = ref();
44
+ const { border, fixed, safeAreaInsetTop, placeholder } = toRefs(props);
45
+ const navHeight = ref("auto");
46
+ const navbarRef = ref();
48
47
  const classes = computed(() => {
49
48
  const prefixCls = componentName;
50
49
  return {
@@ -54,37 +53,44 @@ const _sfc_main = create({
54
53
  [`${prefixCls}--safe-area-inset-top`]: safeAreaInsetTop.value
55
54
  };
56
55
  });
57
- const styles = computed(() => {
58
- return {
59
- zIndex: zIndex.value
60
- };
56
+ const rootStyle = computed(() => {
57
+ if (fixed.value && placeholder.value) {
58
+ return {
59
+ height: navHeight.value
60
+ };
61
+ }
62
+ return {};
61
63
  });
64
+ const getNavHeight = () => {
65
+ if (navbarRef.value) {
66
+ const rect = navbarRef.value.getBoundingClientRect();
67
+ navHeight.value = `${rect.height}px`;
68
+ }
69
+ };
62
70
  onMounted(() => {
63
71
  if (fixed.value && placeholder.value) {
64
72
  nextTick(() => {
65
- var _a;
66
- navHeight.value = (_a = navBarHtml == null ? void 0 : navBarHtml.value) == null ? void 0 : _a.getBoundingClientRect().height;
67
- navBarWrap.value.style.height = navHeight.value + "px";
73
+ getNavHeight();
68
74
  });
69
75
  }
70
76
  });
71
- function handleLeft() {
77
+ const handleLeft = () => {
72
78
  emit("on-click-back");
73
- }
74
- function handleCenter() {
79
+ };
80
+ const handleCenter = () => {
75
81
  emit("on-click-title");
76
- }
77
- function handleCenterIcon() {
82
+ };
83
+ const handleCenterIcon = () => {
78
84
  emit("on-click-icon");
79
- }
80
- function handleRight() {
85
+ };
86
+ const handleRight = () => {
81
87
  emit("on-click-right");
82
- }
88
+ };
83
89
  return {
84
- navBarWrap,
85
- navBarHtml,
90
+ navbarRef,
91
+ rootStyle,
86
92
  classes,
87
- styles,
93
+ navHeight,
88
94
  handleLeft,
89
95
  handleCenter,
90
96
  handleCenterIcon,
@@ -93,35 +99,24 @@ const _sfc_main = create({
93
99
  }
94
100
  });
95
101
  const _hoisted_1 = {
96
- key: 0,
97
- class: "nut-navbar--placeholder",
98
- ref: "navBarWrap"
99
- };
100
- const _hoisted_2 = {
101
- key: 1,
102
- class: "nut-navbar__text"
103
- };
104
- const _hoisted_3 = { class: "nut-navbar__title" };
105
- const _hoisted_4 = {
106
- key: 0,
107
- class: "nut-navbar__text"
108
- };
109
- const _hoisted_5 = {
110
102
  key: 1,
111
103
  class: "nut-navbar__text"
112
104
  };
113
- const _hoisted_6 = { class: "nut-navbar__title" };
114
- const _hoisted_7 = {
105
+ const _hoisted_2 = { class: "nut-navbar__title" };
106
+ const _hoisted_3 = {
115
107
  key: 0,
116
108
  class: "nut-navbar__text"
117
109
  };
118
110
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
119
111
  const _component_Left = resolveComponent("Left");
120
- return _ctx.fixed && _ctx.placeholder ? (openBlock(), createElementBlock("view", _hoisted_1, [
112
+ return openBlock(), createElementBlock("view", {
113
+ class: "nut-navbar--placeholder",
114
+ style: normalizeStyle(_ctx.rootStyle)
115
+ }, [
121
116
  createElementVNode("view", {
122
117
  class: normalizeClass(_ctx.classes),
123
- style: normalizeStyle(_ctx.styles),
124
- ref: "navBarHtml"
118
+ style: normalizeStyle({ zIndex: _ctx.zIndex }),
119
+ ref: "navbarRef"
125
120
  }, [
126
121
  createElementVNode("view", {
127
122
  class: "nut-navbar__left",
@@ -133,10 +128,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
133
128
  color: "#979797"
134
129
  })
135
130
  ]) : createCommentVNode("", true),
136
- _ctx.leftText ? (openBlock(), createElementBlock("view", _hoisted_2, toDisplayString(_ctx.leftText), 1)) : createCommentVNode("", true),
131
+ _ctx.leftText ? (openBlock(), createElementBlock("view", _hoisted_1, toDisplayString(_ctx.leftText), 1)) : createCommentVNode("", true),
137
132
  renderSlot(_ctx.$slots, "left")
138
133
  ]),
139
- createElementVNode("view", _hoisted_3, [
134
+ createElementVNode("view", _hoisted_2, [
140
135
  _ctx.title ? (openBlock(), createElementBlock("view", {
141
136
  key: 0,
142
137
  class: "title",
@@ -157,53 +152,11 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
157
152
  class: "nut-navbar__right",
158
153
  onClick: _cache[4] || (_cache[4] = (...args) => _ctx.handleRight && _ctx.handleRight(...args))
159
154
  }, [
160
- _ctx.desc ? (openBlock(), createElementBlock("view", _hoisted_4, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
155
+ _ctx.desc ? (openBlock(), createElementBlock("view", _hoisted_3, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
161
156
  renderSlot(_ctx.$slots, "right")
162
157
  ])
163
158
  ], 6)
164
- ], 512)) : (openBlock(), createElementBlock("view", {
165
- key: 1,
166
- class: normalizeClass(_ctx.classes),
167
- style: normalizeStyle(_ctx.styles)
168
- }, [
169
- createElementVNode("view", {
170
- class: "nut-navbar__left",
171
- onClick: _cache[5] || (_cache[5] = (...args) => _ctx.handleLeft && _ctx.handleLeft(...args))
172
- }, [
173
- _ctx.leftShow ? renderSlot(_ctx.$slots, "left-show", { key: 0 }, () => [
174
- createVNode(_component_Left, {
175
- height: "12px",
176
- color: "#979797"
177
- })
178
- ]) : createCommentVNode("", true),
179
- _ctx.leftText ? (openBlock(), createElementBlock("view", _hoisted_5, toDisplayString(_ctx.leftText), 1)) : createCommentVNode("", true),
180
- renderSlot(_ctx.$slots, "left")
181
- ]),
182
- createElementVNode("view", _hoisted_6, [
183
- _ctx.title ? (openBlock(), createElementBlock("view", {
184
- key: 0,
185
- class: "title",
186
- onClick: _cache[6] || (_cache[6] = (...args) => _ctx.handleCenter && _ctx.handleCenter(...args))
187
- }, toDisplayString(_ctx.title), 1)) : createCommentVNode("", true),
188
- _ctx.titleIcon ? (openBlock(), createElementBlock("view", {
189
- key: 1,
190
- class: "icon",
191
- onClick: _cache[8] || (_cache[8] = (...args) => _ctx.handleCenterIcon && _ctx.handleCenterIcon(...args))
192
- }, [
193
- renderSlot(_ctx.$slots, "title-icon", {
194
- onClick: _cache[7] || (_cache[7] = (...args) => _ctx.handleCenterIcon && _ctx.handleCenterIcon(...args))
195
- })
196
- ])) : createCommentVNode("", true),
197
- renderSlot(_ctx.$slots, "content")
198
- ]),
199
- createElementVNode("view", {
200
- class: "nut-navbar__right",
201
- onClick: _cache[9] || (_cache[9] = (...args) => _ctx.handleRight && _ctx.handleRight(...args))
202
- }, [
203
- _ctx.desc ? (openBlock(), createElementBlock("view", _hoisted_7, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
204
- renderSlot(_ctx.$slots, "right")
205
- ])
206
- ], 6));
159
+ ], 4);
207
160
  }
208
161
  const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
209
162
  export {
@@ -97,7 +97,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
97
97
  return openBlock(), createElementBlock("view", {
98
98
  class: normalizeClass(_ctx.classes)
99
99
  }, [
100
- _ctx.needSymbol && _ctx.position == "before" ? (openBlock(), createElementBlock("view", {
100
+ _ctx.needSymbol && _ctx.position === "before" ? (openBlock(), createElementBlock("view", {
101
101
  key: 0,
102
102
  class: normalizeClass(["nut-price--symbol", `nut-price--symbol-${_ctx.size}`]),
103
103
  innerHTML: _ctx.showSymbol
@@ -112,7 +112,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
112
112
  createElementVNode("view", {
113
113
  class: normalizeClass(`nut-price--decimal-${_ctx.size}`)
114
114
  }, toDisplayString(_ctx.formatDecimal(_ctx.price)), 3),
115
- _ctx.needSymbol && _ctx.position == "after" ? (openBlock(), createElementBlock("view", {
115
+ _ctx.needSymbol && _ctx.position === "after" ? (openBlock(), createElementBlock("view", {
116
116
  key: 2,
117
117
  class: normalizeClass(["nut-price--symbol", `nut-price--symbol-${_ctx.size}`]),
118
118
  innerHTML: _ctx.showSymbol