@nutui/nutui 4.0.0-beta.9 → 4.0.1-2.beta-1

package/dist/packages/_es/Tour.js

@@ -1,24 +1,36 @@
-import { reactive, ref, computed, onMounted, watch, toRefs, nextTick, resolveComponent, openBlock, createElementBlock, normalizeClass, withDirectives, createElementVNode, vShow, Fragment, renderList, normalizeStyle, createCommentVNode, createVNode, withCtx, renderSlot, toDisplayString } from "vue";
-import { c as createComponent } from "./component-81a4c1d0.js";
-import { u as useRect } from "./index-29892cda.js";
-import { Close } from "@nutui/icons-vue";
-import Popover from "./Popover.js";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+var E = Object.defineProperty, H = Object.defineProperties;
+var W = Object.getOwnPropertyDescriptors;
+var $ = Object.getOwnPropertySymbols;
+var q = Object.prototype.hasOwnProperty, F = Object.prototype.propertyIsEnumerable;
+var T = (t, e, o) => e in t ? E(t, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[e] = o, P = (t, e) => {
+  for (var o in e || (e = {}))
+    q.call(e, o) && T(t, o, e[o]);
+  if ($)
+    for (var o of $(e))
+      F.call(e, o) && T(t, o, e[o]);
+  return t;
+}, B = (t, e) => H(t, W(e));
+import { reactive as I, ref as L, computed as N, onMounted as U, watch as j, toRefs as G, nextTick as J, resolveComponent as O, openBlock as n, createElementBlock as r, normalizeClass as V, withDirectives as K, createElementVNode as i, vShow as Q, Fragment as M, renderList as X, normalizeStyle as Y, createCommentVNode as a, createVNode as R, withCtx as Z, renderSlot as v, toDisplayString as u } from "vue";
+import { c as x } from "./component-234624bc.js";
+import { u as _ } from "./index-192a3ef6.js";
+import { Close as tt } from "@nutui/icons-vue";
+import z from "./Popover.js";
+import { _ as et } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-import "./renderIcon-3d0fd47c.js";
-import "./index-da7aa231.js";
+import "./renderIcon-47498b32.js";
+import "./index-360c5092.js";
 import "./Overlay.js";
-const { create } = createComponent("tour");
-const _sfc_main = create({
+const { create: ot } = x("tour"), st = ot({
   components: {
-    [Popover.name]: Popover,
-    Close
+    [z.name]: z,
+    Close: tt
   },
   props: {
-    visible: { type: Boolean, default: false },
+    modelValue: { type: Boolean, default: !1 },
     type: {
       type: String,
       default: "step"
+      // tile
     },
     steps: {
       type: Array,
@@ -46,7 +58,7 @@ const _sfc_main = create({
     },
     mask: {
       type: Boolean,
-      default: true
+      default: !0
     },
     offset: {
       type: Array,
@@ -70,196 +82,149 @@ const _sfc_main = create({
     },
     closeOnClickOverlay: {
       type: Boolean,
-      default: true
+      default: !0
     },
     showPrevStep: {
       type: Boolean,
-      default: true
+      default: !0
     },
     showTitleBar: {
       type: Boolean,
-      default: true
+      default: !0
     }
   },
-  emits: ["update:visible", "change", "close"],
-  setup(props, { emit }) {
-    const state = reactive({
-      showTour: props.visible,
-      showPopup: false,
+  emits: ["update:modelValue", "change", "close"],
+  setup(t, { emit: e }) {
+    const o = I({
+      showTour: t.modelValue,
+      showPopup: !1,
       active: 0
-    });
-    const maskRect = ref({});
-    const classes = computed(() => {
-      const prefixCls = "nut-tour";
-      return `${prefixCls}`;
-    });
-    const maskStyle = computed(() => {
-      const { offset, maskWidth, maskHeight } = props;
-      const { width, height, left, top } = maskRect.value;
-      const center = [left + width / 2, top + height / 2];
-      const w = Number(maskWidth ? maskWidth : width);
-      const h = Number(maskHeight ? maskHeight : height);
-      const styles = {
-        width: `${w + +offset[1] * 2}px`,
-        height: `${h + +offset[0] * 2}px`,
-        top: `${center[1] - h / 2 - +offset[0]}px`,
-        left: `${center[0] - w / 2 - +offset[1]}px`
+    }), m = L({}), h = N(() => "nut-tour"), y = N(() => {
+      const { offset: s, maskWidth: d, maskHeight: k } = t, { width: g, height: w, left: A, top: D } = m.value, S = [A + g / 2, D + w / 2], C = Number(d || g), b = Number(k || w);
+      return {
+        width: `${C + +s[1] * 2}px`,
+        height: `${b + +s[0] * 2}px`,
+        top: `${S[1] - b / 2 - +s[0]}px`,
+        left: `${S[0] - C / 2 - +s[1]}px`
       };
-      return styles;
-    });
-    const changeStep = (type) => {
-      if (type == "next") {
-        state.active = state.active + 1;
-      } else {
-        state.active = state.active - 1;
-      }
-      state.showPopup = false;
-      nextTick(() => {
-        state.showPopup = true;
-        getRootPosition();
-      });
-      emit("change", state.active);
+    }), f = (s) => {
+      s == "next" ? o.active = o.active + 1 : o.active = o.active - 1, o.showPopup = !1, J(() => {
+        o.showPopup = !0, p();
+      }), e("change", o.active);
+    }, p = () => {
+      const s = document.querySelector(`#${t.steps[o.active].target}`), d = _(s);
+      m.value = d;
+    }, l = () => {
+      o.showTour = !1, o.showPopup = !1, e("close", o.active), e("update:modelValue", !1);
+    }, c = () => {
+      t.closeOnClickOverlay && l();
     };
-    const getRootPosition = () => {
-      const el = document.querySelector(`#${props.steps[state.active].target}`);
-      const rect = useRect(el);
-      maskRect.value = rect;
-    };
-    const close = () => {
-      state.showTour = false;
-      state.showPopup = false;
-      emit("close", state.active);
-      emit("update:visible", false);
-    };
-    const handleClickMask = () => {
-      props.closeOnClickOverlay && close();
-    };
-    onMounted(() => {
-      state.active = 0;
-      getRootPosition();
-    });
-    watch(
-      () => props.visible,
-      (val) => {
-        if (val) {
-          getRootPosition();
-        }
-        state.active = 0;
-        state.showTour = val;
-        state.showPopup = val;
+    return U(() => {
+      o.active = 0, p();
+    }), j(
+      () => t.modelValue,
+      (s) => {
+        s && p(), o.active = 0, o.showTour = s, o.showPopup = s;
       }
-    );
-    return {
-      ...toRefs(state),
-      classes,
-      maskStyle,
-      changeStep,
-      close,
-      handleClickMask
-    };
+    ), B(P({}, G(o)), {
+      classes: h,
+      maskStyle: y,
+      changeStep: f,
+      close: l,
+      handleClickMask: c
+    });
   }
-});
-const _hoisted_1 = {
+}), nt = {
   key: 0,
   class: "nut-tour-content"
-};
-const _hoisted_2 = {
+}, rt = {
   key: 0,
   class: "nut-tour-content-top"
-};
-const _hoisted_3 = { class: "nut-tour-content-inner" };
-const _hoisted_4 = { class: "nut-tour-content-bottom" };
-const _hoisted_5 = { class: "nut-tour-content-bottom-init" };
-const _hoisted_6 = { class: "nut-tour-content-bottom-operate" };
-const _hoisted_7 = {
+}, lt = { class: "nut-tour-content-inner" }, at = { class: "nut-tour-content-bottom" }, it = { class: "nut-tour-content-bottom-init" }, ut = { class: "nut-tour-content-bottom-operate" }, pt = {
   key: 1,
   class: "nut-tour-content nut-tour-content-tile"
-};
-const _hoisted_8 = { class: "nut-tour-content-inner" };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_Close = resolveComponent("Close");
-  const _component_nut_popover = resolveComponent("nut-popover");
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass(_ctx.classes)
+}, ct = { class: "nut-tour-content-inner" };
+function dt(t, e, o, m, h, y) {
+  const f = O("Close"), p = O("nut-popover");
+  return n(), r("div", {
+    class: V(t.classes)
   }, [
-    withDirectives(createElementVNode("div", {
+    K(i("div", {
       class: "nut-tour-masked",
-      onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClickMask && _ctx.handleClickMask(...args))
+      onClick: e[0] || (e[0] = (...l) => t.handleClickMask && t.handleClickMask(...l))
     }, null, 512), [
-      [vShow, _ctx.showTour]
+      [Q, t.showTour]
     ]),
-    (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.steps, (step, i) => {
-      return openBlock(), createElementBlock("div", {
-        key: i,
-        style: { "height": "0" }
-      }, [
-        i == _ctx.active ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-          _ctx.showTour ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            class: normalizeClass(["nut-tour-mask", [_ctx.mask ? "" : "nut-tour-mask-none"]]),
-            style: normalizeStyle(_ctx.maskStyle),
-            id: "nut-tour-popid"
-          }, null, 6)) : createCommentVNode("", true),
-          createVNode(_component_nut_popover, {
-            visible: _ctx.showPopup,
-            "onUpdate:visible": _cache[5] || (_cache[5] = ($event) => _ctx.showPopup = $event),
-            location: step.location || _ctx.location,
-            targetId: "nut-tour-popid",
-            bgColor: _ctx.bgColor,
-            theme: _ctx.theme,
-            "close-on-click-outside": false,
-            offset: step.popoverOffset || [0, 12],
-            arrowOffset: step.arrowOffset || 0
-          }, {
-            content: withCtx(() => [
-              renderSlot(_ctx.$slots, "default", {}, () => [
-                _ctx.type == "step" ? (openBlock(), createElementBlock("div", _hoisted_1, [
-                  _ctx.showTitleBar ? (openBlock(), createElementBlock("div", _hoisted_2, [
-                    createElementVNode("div", {
-                      onClick: _cache[1] || (_cache[1] = (...args) => _ctx.close && _ctx.close(...args))
-                    }, [
-                      createVNode(_component_Close, { class: "nut-tour-content-top-close" })
-                    ])
-                  ])) : createCommentVNode("", true),
-                  createElementVNode("div", _hoisted_3, toDisplayString(step.content), 1),
-                  createElementVNode("div", _hoisted_4, [
-                    createElementVNode("div", _hoisted_5, toDisplayString(_ctx.active + 1) + "/" + toDisplayString(_ctx.steps.length), 1),
-                    createElementVNode("div", _hoisted_6, [
-                      renderSlot(_ctx.$slots, "prevStep", {}, () => [
-                        _ctx.active != 0 && _ctx.showPrevStep ? (openBlock(), createElementBlock("div", {
-                          key: 0,
-                          class: "nut-tour-content-bottom-operate-btn",
-                          onClick: _cache[2] || (_cache[2] = ($event) => _ctx.changeStep("prev"))
-                        }, toDisplayString(_ctx.prevStepTxt), 1)) : createCommentVNode("", true)
-                      ]),
-                      _ctx.steps.length - 1 == _ctx.active ? (openBlock(), createElementBlock("div", {
+    (n(!0), r(M, null, X(t.steps, (l, c) => (n(), r("div", {
+      key: c,
+      style: { height: "0" }
+    }, [
+      c == t.active ? (n(), r(M, { key: 0 }, [
+        t.showTour ? (n(), r("div", {
+          key: 0,
+          class: V(["nut-tour-mask", [t.mask ? "" : "nut-tour-mask-none"]]),
+          style: Y(t.maskStyle),
+          id: "nut-tour-popid"
+        }, null, 6)) : a("", !0),
+        R(p, {
+          visible: t.showPopup,
+          "onUpdate:visible": e[5] || (e[5] = (s) => t.showPopup = s),
+          location: l.location || t.location,
+          targetId: "nut-tour-popid",
+          bgColor: t.bgColor,
+          theme: t.theme,
+          "close-on-click-outside": !1,
+          offset: l.popoverOffset || [0, 12],
+          arrowOffset: l.arrowOffset || 0
+        }, {
+          content: Z(() => [
+            v(t.$slots, "default", {}, () => [
+              t.type == "step" ? (n(), r("div", nt, [
+                t.showTitleBar ? (n(), r("div", rt, [
+                  i("div", {
+                    onClick: e[1] || (e[1] = (...s) => t.close && t.close(...s))
+                  }, [
+                    R(f, { class: "nut-tour-content-top-close" })
+                  ])
+                ])) : a("", !0),
+                i("div", lt, u(l.content), 1),
+                i("div", at, [
+                  i("div", it, u(t.active + 1) + "/" + u(t.steps.length), 1),
+                  i("div", ut, [
+                    v(t.$slots, "prev-step", {}, () => [
+                      t.active != 0 && t.showPrevStep ? (n(), r("div", {
+                        key: 0,
+                        class: "nut-tour-content-bottom-operate-btn",
+                        onClick: e[2] || (e[2] = (s) => t.changeStep("prev"))
+                      }, u(t.prevStepTxt), 1)) : a("", !0)
+                    ]),
+                    t.steps.length - 1 == t.active ? (n(), r("div", {
+                      key: 0,
+                      class: "nut-tour-content-bottom-operate-btn active",
+                      onClick: e[3] || (e[3] = (...s) => t.close && t.close(...s))
+                    }, u(t.completeTxt), 1)) : a("", !0),
+                    v(t.$slots, "next-step", {}, () => [
+                      t.steps.length - 1 != t.active ? (n(), r("div", {
                         key: 0,
                         class: "nut-tour-content-bottom-operate-btn active",
-                        onClick: _cache[3] || (_cache[3] = (...args) => _ctx.close && _ctx.close(...args))
-                      }, toDisplayString(_ctx.completeTxt), 1)) : createCommentVNode("", true),
-                      renderSlot(_ctx.$slots, "nextStep", {}, () => [
-                        _ctx.steps.length - 1 != _ctx.active ? (openBlock(), createElementBlock("div", {
-                          key: 0,
-                          class: "nut-tour-content-bottom-operate-btn active",
-                          onClick: _cache[4] || (_cache[4] = ($event) => _ctx.changeStep("next"))
-                        }, toDisplayString(_ctx.nextStepTxt), 1)) : createCommentVNode("", true)
-                      ])
+                        onClick: e[4] || (e[4] = (s) => t.changeStep("next"))
+                      }, u(t.nextStepTxt), 1)) : a("", !0)
                     ])
                   ])
-                ])) : createCommentVNode("", true),
-                _ctx.type == "tile" ? (openBlock(), createElementBlock("div", _hoisted_7, [
-                  createElementVNode("div", _hoisted_8, toDisplayString(step.content), 1)
-                ])) : createCommentVNode("", true)
-              ])
-            ]),
-            _: 2
-          }, 1032, ["visible", "location", "bgColor", "theme", "offset", "arrowOffset"])
-        ], 64)) : createCommentVNode("", true)
-      ]);
-    }), 128))
+                ])
+              ])) : a("", !0),
+              t.type == "tile" ? (n(), r("div", pt, [
+                i("div", ct, u(l.content), 1)
+              ])) : a("", !0)
+            ])
+          ]),
+          _: 2
+        }, 1032, ["visible", "location", "bgColor", "theme", "offset", "arrowOffset"])
+      ], 64)) : a("", !0)
+    ]))), 128))
   ], 2);
 }
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const Tt = /* @__PURE__ */ et(st, [["render", dt]]);
 export {
-  index as default
+  Tt as default
 };

package/dist/packages/_es/TrendArrow.js

@@ -1,11 +1,22 @@
-import { reactive, computed, toRefs, resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, createVNode } from "vue";
-import { m as myFixed, c as createComponent } from "./component-81a4c1d0.js";
-import { TriangleUp, TriangleDown } from "@nutui/icons-vue";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+var R = Object.defineProperty, h = Object.defineProperties;
+var k = Object.getOwnPropertyDescriptors;
+var m = Object.getOwnPropertySymbols;
+var B = Object.prototype.hasOwnProperty, D = Object.prototype.propertyIsEnumerable;
+var y = (e, r, t) => r in e ? R(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, w = (e, r) => {
+  for (var t in r || (r = {}))
+    B.call(r, t) && y(e, t, r[t]);
+  if (m)
+    for (var t of m(r))
+      D.call(r, t) && y(e, t, r[t]);
+  return e;
+}, C = (e, r) => h(e, k(r));
+import { reactive as v, computed as u, toRefs as L, resolveComponent as g, openBlock as i, createElementBlock as p, normalizeClass as U, normalizeStyle as T, toDisplayString as S, createCommentVNode as s, renderSlot as b, createVNode as N } from "vue";
+import { m as z, c as V } from "./component-234624bc.js";
+import { TriangleUp as Z, TriangleDown as E } from "@nutui/icons-vue";
+import { _ as F } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-const { componentName, create } = createComponent("trend-arrow");
-const _sfc_main = create({
-  components: { TriangleUp, TriangleDown },
+const { componentName: M, create: j } = V("trend-arrow"), q = j({
+  components: { TriangleUp: Z, TriangleDown: E },
   props: {
     rate: {
       type: Number,
@@ -17,19 +28,19 @@ const _sfc_main = create({
     },
     showSign: {
       type: Boolean,
-      default: false
+      default: !1
     },
     showZero: {
       type: Boolean,
-      default: false
+      default: !1
     },
     arrowLeft: {
       type: Boolean,
-      default: false
+      default: !1
     },
     syncTextColor: {
       type: Boolean,
-      default: true
+      default: !0
     },
     textColor: {
       type: String,
@@ -44,64 +55,52 @@ const _sfc_main = create({
       default: "#64b578"
     }
   },
-  setup(props) {
-    const state = reactive({
-      rateTrend: props.rate > 0 ? true : false
-    });
-    const classes = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [prefixCls]: true
-      };
-    });
-    const calcRate = computed(() => {
-      const { rate, digits, showSign, showZero } = props;
-      state.rateTrend = rate > 0 ? true : false;
-      const absRate = Math.abs(rate);
-      if (!showZero && rate === 0) {
-        return "--";
-      }
-      let resultRate = `${showSign && rate !== 0 ? state.rateTrend ? "+" : "-" : ""}${myFixed(
-        Number(absRate),
-        digits
+  setup(e) {
+    const r = v({
+      rateTrend: e.rate > 0
+    }), t = u(() => ({
+      [M]: !0
+    })), d = u(() => {
+      const { rate: o, digits: a, showSign: n, showZero: l } = e;
+      r.rateTrend = o > 0;
+      const c = Math.abs(o);
+      return !l && o === 0 ? "--" : `${n && o !== 0 ? r.rateTrend ? "+" : "-" : ""}${z(
+        Number(c),
+        a
       )}%`;
-      return resultRate;
-    });
-    const calcStyle = computed(() => {
-      const { dropColor, riseColor, syncTextColor, textColor, rate } = props;
-      let style = {
-        color: rate === 0 ? textColor : syncTextColor ? state.rateTrend ? riseColor : dropColor : textColor
+    }), f = u(() => {
+      const { dropColor: o, riseColor: a, syncTextColor: n, textColor: l, rate: c } = e;
+      return {
+        color: c === 0 ? l : n ? r.rateTrend ? a : o : l
       };
-      return style;
     });
-    return { ...toRefs(state), classes, calcRate, calcStyle };
+    return C(w({}, L(r)), { classes: t, calcRate: d, calcStyle: f });
   }
 });
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_TriangleUp = resolveComponent("TriangleUp");
-  const _component_TriangleDown = resolveComponent("TriangleDown");
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes)
+function A(e, r, t, d, f, o) {
+  const a = g("TriangleUp"), n = g("TriangleDown");
+  return i(), p("view", {
+    class: U(e.classes)
   }, [
-    !_ctx.arrowLeft ? (openBlock(), createElementBlock("span", {
+    e.arrowLeft ? s("", !0) : (i(), p("span", {
       key: 0,
       class: "nut-trend-arrow-icon-before nut-trend-arrow-rate",
-      style: normalizeStyle(_ctx.calcStyle)
-    }, toDisplayString(_ctx.calcRate), 5)) : createCommentVNode("", true),
-    Number(_ctx.rate) !== 0 && _ctx.rateTrend ? renderSlot(_ctx.$slots, "upIcon", { key: 1 }, () => [
-      createVNode(_component_TriangleUp, { color: _ctx.riseColor }, null, 8, ["color"])
-    ]) : createCommentVNode("", true),
-    Number(_ctx.rate) !== 0 && !_ctx.rateTrend ? renderSlot(_ctx.$slots, "downIcon", { key: 2 }, () => [
-      createVNode(_component_TriangleDown, { color: _ctx.dropColor }, null, 8, ["color"])
-    ]) : createCommentVNode("", true),
-    _ctx.arrowLeft ? (openBlock(), createElementBlock("span", {
+      style: T(e.calcStyle)
+    }, S(e.calcRate), 5)),
+    Number(e.rate) !== 0 && e.rateTrend ? b(e.$slots, "up-icon", { key: 1 }, () => [
+      N(a, { color: e.riseColor }, null, 8, ["color"])
+    ]) : s("", !0),
+    Number(e.rate) !== 0 && !e.rateTrend ? b(e.$slots, "down-icon", { key: 2 }, () => [
+      N(n, { color: e.dropColor }, null, 8, ["color"])
+    ]) : s("", !0),
+    e.arrowLeft ? (i(), p("span", {
       key: 3,
       class: "nut-trend-arrow-icon-after nut-trend-arrow-rate",
-      style: normalizeStyle(_ctx.calcStyle)
-    }, toDisplayString(_ctx.calcRate), 5)) : createCommentVNode("", true)
+      style: T(e.calcStyle)
+    }, S(e.calcRate), 5)) : s("", !0)
   ], 2);
 }
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const P = /* @__PURE__ */ F(q, [["render", A]]);
 export {
-  index as default
+  P as default
 };