@nutui/nutui 3.1.6 → 3.1.7

package/dist/packages/_es/Popup.js

@@ -0,0 +1,268 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+/*!
+* @nutui/nutui v3.1.7 Thu Sep 30 2021 20:17:02 GMT+0800 (中国标准时间)
+* (c) 2021 @jdf2e.
+* Released under the MIT License.
+*/
+import { reactive, computed, onMounted, onBeforeUnmount, onBeforeMount, onActivated, onDeactivated, watch, toRefs, resolveComponent, openBlock, createBlock, Teleport, normalizeClass, normalizeStyle, createCommentVNode, createVNode, Transition, withCtx, withDirectives, createElementVNode, renderSlot, createElementBlock, vShow } from "vue";
+import overlay, { overlayProps } from "./OverLay.js";
+import _sfc_main$1 from "./Icon.js";
+import { c as createComponent } from "./component.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import "./pxCheck.js";
+let count = 0;
+const CLSNAME = "nut-overflow-hidden";
+const useLockScroll = (isLock) => {
+  const lock = () => {
+    if (isLock()) {
+      !count && document.body.classList.add(CLSNAME);
+      count++;
+    }
+  };
+  const unlock = () => {
+    if (isLock() && count) {
+      count--;
+      !count && document.body.classList.remove(CLSNAME);
+    }
+  };
+  return [lock, unlock];
+};
+const { componentName, create } = createComponent("popup");
+let _zIndex = 2e3;
+const popupProps = __spreadProps(__spreadValues({}, overlayProps), {
+  position: {
+    type: String,
+    default: "center"
+  },
+  transition: String,
+  style: {
+    type: Object
+  },
+  popClass: {
+    type: String,
+    default: ""
+  },
+  closeable: {
+    type: Boolean,
+    default: false
+  },
+  closeIconPosition: {
+    type: String,
+    default: "top-right"
+  },
+  closeIcon: {
+    type: String,
+    default: "close"
+  },
+  destroyOnClose: {
+    type: Boolean,
+    default: true
+  },
+  teleport: {
+    type: [String, Element],
+    default: "body"
+  },
+  overlay: {
+    type: Boolean,
+    default: true
+  },
+  round: {
+    type: Boolean,
+    default: false
+  }
+});
+const _sfc_main = create({
+  components: {
+    [overlay.name]: overlay,
+    [_sfc_main$1.name]: _sfc_main$1
+  },
+  props: __spreadValues({}, popupProps),
+  emits: [
+    "click",
+    "click-close-icon",
+    "open",
+    "close",
+    "opend",
+    "closed",
+    "update:visible",
+    "click-overlay"
+  ],
+  setup(props, { emit }) {
+    const state = reactive({
+      zIndex: props.zIndex ? props.zIndex : _zIndex,
+      showSlot: true,
+      transitionName: `popup-fade-${props.position}`,
+      overLayCount: 1,
+      keepAlive: false
+    });
+    const [lockScroll, unlockScroll] = useLockScroll(() => props.lockScroll);
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true,
+        ["round"]: props.round,
+        [`popup-${props.position}`]: true,
+        [props.popClass]: true
+      };
+    });
+    const popStyle = computed(() => {
+      return __spreadValues({
+        zIndex: state.zIndex,
+        animationDuration: props.duration ? `${props.duration}s` : "initial"
+      }, props.style);
+    });
+    const open = () => {
+      if (!props.visible) {
+        if (props.zIndex !== void 0) {
+          _zIndex = Number(props.zIndex);
+        }
+        emit("update:visible", true);
+        lockScroll();
+        state.zIndex = ++_zIndex;
+      }
+      if (props.destroyOnClose) {
+        state.showSlot = true;
+      }
+      emit("open");
+    };
+    const close = () => {
+      if (props.visible) {
+        unlockScroll();
+        emit("update:visible", false);
+        if (props.destroyOnClose) {
+          setTimeout(() => {
+            state.showSlot = false;
+            emit("close");
+          }, +props.duration * 1e3);
+        }
+      }
+    };
+    const onClick = (e) => {
+      emit("click", e);
+    };
+    const onClickCloseIcon = (e) => {
+      emit("click-close-icon", e);
+      close();
+    };
+    const onClickOverlay = (e) => {
+      if (props.closeOnClickOverlay) {
+        emit("click-overlay", e);
+        close();
+      }
+    };
+    const onOpened = (e) => {
+      emit("opend", e);
+    };
+    const onClosed = (e) => {
+      emit("closed", e);
+    };
+    onMounted(() => {
+      props.transition ? state.transitionName = props.transition : state.transitionName = `popup-slide-${props.position}`;
+      props.visible && open();
+    });
+    onBeforeUnmount(() => {
+      props.visible && close();
+    });
+    onBeforeMount(() => {
+      if (props.visible) {
+        unlockScroll();
+      }
+    });
+    onActivated(() => {
+      if (state.keepAlive) {
+        emit("update:visible", true);
+        state.keepAlive = false;
+      }
+    });
+    onDeactivated(() => {
+      if (props.visible) {
+        close();
+        state.keepAlive = true;
+      }
+    });
+    watch(() => props.visible, (value) => {
+      if (value) {
+        open();
+      } else {
+        close();
+      }
+    });
+    watch(() => props.position, (value) => {
+      value === "center" ? state.transitionName = "popup-fade" : state.transitionName = `popup-slide-${value}`;
+    });
+    return __spreadProps(__spreadValues({}, toRefs(state)), {
+      popStyle,
+      classes,
+      onClick,
+      onClickCloseIcon,
+      onClickOverlay,
+      onOpened,
+      onClosed
+    });
+  }
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_nut_overlay = resolveComponent("nut-overlay");
+  const _component_nut_icon = resolveComponent("nut-icon");
+  return openBlock(), createBlock(Teleport, { to: _ctx.teleport }, [
+    _ctx.overlay ? (openBlock(), createBlock(_component_nut_overlay, {
+      key: 0,
+      visible: _ctx.visible,
+      "close-on-click-overlay": _ctx.closeOnClickOverlay,
+      class: normalizeClass(_ctx.overlayClass),
+      style: normalizeStyle(_ctx.overlayStyle),
+      "z-index": _ctx.zIndex,
+      "lock-scroll": _ctx.lockScroll,
+      duration: _ctx.duration,
+      onClick: _ctx.onClickOverlay
+    }, null, 8, ["visible", "close-on-click-overlay", "class", "style", "z-index", "lock-scroll", "duration", "onClick"])) : createCommentVNode("", true),
+    createVNode(Transition, {
+      name: _ctx.transitionName,
+      onAfterEnter: _ctx.onOpened,
+      onAfterLeave: _ctx.onClosed
+    }, {
+      default: withCtx(() => [
+        withDirectives(createElementVNode("view", {
+          class: normalizeClass(_ctx.classes),
+          style: normalizeStyle(_ctx.popStyle),
+          onClick: _cache[1] || (_cache[1] = (...args) => _ctx.onClick && _ctx.onClick(...args))
+        }, [
+          _ctx.showSlot ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true),
+          _ctx.closeable ? (openBlock(), createElementBlock("view", {
+            key: 1,
+            onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClickCloseIcon && _ctx.onClickCloseIcon(...args)),
+            class: normalizeClass(["nutui-popup__close-icon", "nutui-popup__close-icon--" + _ctx.closeIconPosition])
+          }, [
+            createVNode(_component_nut_icon, {
+              name: _ctx.closeIcon,
+              size: "12px"
+            }, null, 8, ["name"])
+          ], 2)) : createCommentVNode("", true)
+        ], 6), [
+          [vShow, _ctx.visible]
+        ])
+      ]),
+      _: 3
+    }, 8, ["name", "onAfterEnter", "onAfterLeave"])
+  ], 8, ["to"]);
+}
+var Popup = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { Popup as default, popupProps };

package/dist/packages/_es/Price.js

@@ -0,0 +1,104 @@
+/*!
+* @nutui/nutui v3.1.7 Thu Sep 30 2021 20:17:02 GMT+0800 (中国标准时间)
+* (c) 2021 @jdf2e.
+* Released under the MIT License.
+*/
+import { computed, openBlock, createElementBlock, normalizeClass, createCommentVNode, createElementVNode, toDisplayString } from "vue";
+import { c as createComponent } from "./component.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+const { componentName, create } = createComponent("price");
+const _sfc_main = create({
+  props: {
+    price: {
+      type: [Number, String],
+      default: 0
+    },
+    needSymbol: {
+      type: Boolean,
+      default: true
+    },
+    symbol: {
+      type: String,
+      default: "¥"
+    },
+    decimalDigits: {
+      type: Number,
+      default: 2
+    },
+    thousands: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props) {
+    const classes = computed(() => {
+      return {
+        [componentName]: true
+      };
+    });
+    const showSymbol = computed(() => {
+      const symbol = props.needSymbol ? props.symbol : "";
+      return symbol;
+    });
+    const checkPoint = (price) => {
+      return String(price).indexOf(".") > 0;
+    };
+    const formatThousands = (num) => {
+      if (Number(num) == 0) {
+        num = 0;
+      }
+      if (checkPoint(num)) {
+        num = Number(num).toFixed(props.decimalDigits);
+        num = typeof num.split(".") === "string" ? num.split(".") : num.split(".")[0];
+      } else {
+        num = num.toString();
+      }
+      if (props.thousands) {
+        return (num || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, "$1,");
+      } else {
+        return num;
+      }
+    };
+    const formatDecimal = (decimalNum) => {
+      if (Number(decimalNum) == 0) {
+        decimalNum = 0;
+      }
+      if (checkPoint(decimalNum)) {
+        decimalNum = Number(decimalNum).toFixed(props.decimalDigits);
+        decimalNum = typeof decimalNum.split(".") === "string" ? 0 : decimalNum.split(".")[1];
+      } else {
+        decimalNum = 0;
+      }
+      const result = "0." + decimalNum;
+      const resultFixed = Number(result).toFixed(props.decimalDigits);
+      return String(resultFixed).substring(2, resultFixed.length);
+    };
+    return {
+      classes,
+      showSymbol,
+      checkPoint,
+      formatThousands,
+      formatDecimal
+    };
+  }
+});
+const _hoisted_1 = ["innerHTML"];
+const _hoisted_2 = { class: "nut-price--big" };
+const _hoisted_3 = /* @__PURE__ */ createElementVNode("view", { class: "nut-price--point" }, ".", -1);
+const _hoisted_4 = { class: "nut-price--small" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes)
+  }, [
+    _ctx.needSymbol ? (openBlock(), createElementBlock("view", {
+      key: 0,
+      class: "nut-price--symbol",
+      innerHTML: _ctx.showSymbol
+    }, null, 8, _hoisted_1)) : createCommentVNode("", true),
+    createElementVNode("view", _hoisted_2, toDisplayString(_ctx.formatThousands(_ctx.price)), 1),
+    _hoisted_3,
+    createElementVNode("view", _hoisted_4, toDisplayString(_ctx.formatDecimal(_ctx.price)), 1)
+  ], 2);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };

package/dist/packages/_es/Progress.js

@@ -0,0 +1,131 @@
+/*!
+* @nutui/nutui v3.1.7 Thu Sep 30 2021 20:17:02 GMT+0800 (中国标准时间)
+* (c) 2021 @jdf2e.
+* Released under the MIT License.
+*/
+import { ref, computed, watch, onMounted, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, toDisplayString, createCommentVNode, createBlock } from "vue";
+import { c as createComponent } from "./component.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+const { create } = createComponent("progress");
+const _sfc_main = create({
+  props: {
+    percentage: {
+      type: [Number, String],
+      default: 0,
+      required: true
+    },
+    size: {
+      type: String,
+      default: "base"
+    },
+    status: {
+      type: String,
+      default: ""
+    },
+    strokeWidth: {
+      type: [Number, String],
+      default: ""
+    },
+    textInside: {
+      type: Boolean,
+      default: false
+    },
+    showText: {
+      type: Boolean,
+      default: true
+    },
+    strokeColor: {
+      type: String,
+      default: ""
+    },
+    textColor: {
+      tyep: String,
+      default: ""
+    },
+    iconName: {
+      type: String,
+      default: "checked"
+    },
+    iconColor: {
+      type: String,
+      default: "#439422"
+    }
+  },
+  setup(props, { emit }) {
+    const height = ref(props.strokeWidth + "px");
+    const progressOuter = ref();
+    const left = ref();
+    const bgStyle = computed(() => {
+      return {
+        width: props.percentage + "%",
+        background: props.strokeColor || ""
+      };
+    });
+    const textStyle = computed(() => {
+      return {
+        color: props.textColor || ""
+      };
+    });
+    watch(() => props.percentage, (values) => {
+      console.log("progressOuter.value.offsetWidth", progressOuter.value.offsetWidth);
+      console.log("values", values);
+      left.value = progressOuter.value.offsetWidth * Number(values) * 0.01 - 5 + "px";
+    });
+    onMounted(() => {
+      left.value = progressOuter.value.offsetWidth * Number(props.percentage) * 0.01 - 5 + "px";
+    });
+    return {
+      height,
+      bgStyle,
+      textStyle,
+      progressOuter,
+      left
+    };
+  }
+});
+const _hoisted_1 = { class: "nut-progress" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_nut_icon = resolveComponent("nut-icon");
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createElementVNode("div", {
+      class: normalizeClass(["nut-progress-outer", [
+        _ctx.showText && !_ctx.textInside ? "nut-progress-outer-part" : "",
+        _ctx.size ? "nut-progress-" + _ctx.size : ""
+      ]]),
+      ref: "progressOuter",
+      style: normalizeStyle({ height: _ctx.height })
+    }, [
+      createElementVNode("div", {
+        class: normalizeClass(["nut-progress-inner", _ctx.status == "active" ? "nut-active" : ""]),
+        style: normalizeStyle(_ctx.bgStyle)
+      }, [
+        _ctx.showText && _ctx.textInside ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "nut-progress-text nut-progress-insidetext",
+          style: normalizeStyle({ lineHeight: _ctx.height, left: _ctx.left })
+        }, [
+          createElementVNode("span", {
+            style: normalizeStyle(_ctx.textStyle)
+          }, toDisplayString(_ctx.percentage) + "%", 5)
+        ], 4)) : createCommentVNode("", true)
+      ], 6)
+    ], 6),
+    _ctx.showText && !_ctx.textInside ? (openBlock(), createElementBlock("div", {
+      key: 0,
+      class: "nut-progress-text",
+      style: normalizeStyle({ lineHeight: _ctx.height })
+    }, [
+      _ctx.status == "active" || _ctx.status == "" ? (openBlock(), createElementBlock("span", {
+        key: 0,
+        style: normalizeStyle(_ctx.textStyle)
+      }, toDisplayString(_ctx.percentage) + "%", 5)) : _ctx.status == "icon" ? (openBlock(), createBlock(_component_nut_icon, {
+        key: 1,
+        size: "16px",
+        name: _ctx.iconName,
+        color: _ctx.iconColor
+      }, null, 8, ["name", "color"])) : createCommentVNode("", true)
+    ], 4)) : createCommentVNode("", true)
+  ]);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };

package/dist/packages/_es/Radio.js

@@ -0,0 +1,72 @@
+/*!
+* @nutui/nutui v3.1.7 Thu Sep 30 2021 20:17:02 GMT+0800 (中国标准时间)
+* (c) 2021 @jdf2e.
+* Released under the MIT License.
+*/
+import { inject, computed, h } from "vue";
+import { c as createComponent } from "./component.js";
+import _sfc_main$1 from "./Icon.js";
+import "./pxCheck.js";
+const { componentName, create } = createComponent("radio");
+const _sfc_main = create({
+  props: {
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    iconName: {
+      type: String,
+      default: "check-normal"
+    },
+    iconActiveName: {
+      type: String,
+      default: "check-checked"
+    },
+    iconSize: {
+      type: [String, Number],
+      default: 18
+    }
+  },
+  setup(props, { emit, slots }) {
+    let parent = inject("parent");
+    const isCurValue = computed(() => {
+      return parent.label.value === props.label;
+    });
+    const color = computed(() => {
+      return !props.disabled ? isCurValue.value ? "nut-radio__icon" : "nut-radio__icon--unchecked" : "nut-radio__icon--disable";
+    });
+    const position = computed(() => {
+      return parent.position;
+    });
+    const renderIcon = () => {
+      const { iconName, iconSize, iconActiveName } = props;
+      return h(_sfc_main$1, {
+        name: isCurValue.value ? iconActiveName : iconName,
+        size: iconSize,
+        class: color.value
+      });
+    };
+    const renderLabel = () => {
+      var _a;
+      return h("view", {
+        class: `${componentName}__label ${props.disabled ? `${componentName}__label--disabled` : ""}`
+      }, (_a = slots.default) == null ? void 0 : _a.call(slots));
+    };
+    const handleClick = () => {
+      if (isCurValue.value || props.disabled)
+        return;
+      parent.updateValue(props.label);
+    };
+    return () => {
+      return h("view", {
+        class: `${componentName} ${position.value === "left" ? `${componentName}--reverse` : ""}`,
+        onClick: handleClick
+      }, [renderIcon(), renderLabel()]);
+    };
+  }
+});
+export { _sfc_main as default };

package/dist/packages/_es/RadioGroup.js

@@ -0,0 +1,37 @@
+/*!
+* @nutui/nutui v3.1.7 Thu Sep 30 2021 20:17:02 GMT+0800 (中国标准时间)
+* (c) 2021 @jdf2e.
+* Released under the MIT License.
+*/
+import { provide, readonly, computed, watch, h } from "vue";
+import { c as createComponent } from "./component.js";
+const { componentName, create } = createComponent("radiogroup");
+const _sfc_main = create({
+  props: {
+    modelValue: {
+      type: [Number, String, Boolean],
+      default: ""
+    },
+    textPosition: {
+      type: String,
+      default: "right"
+    }
+  },
+  emits: ["change", "update:modelValue"],
+  setup(props, { emit, slots }) {
+    const updateValue = (value) => emit("update:modelValue", value);
+    provide("parent", {
+      label: readonly(computed(() => props.modelValue)),
+      position: props.textPosition,
+      updateValue
+    });
+    watch(() => props.modelValue, (value) => emit("change", value));
+    return () => {
+      var _a;
+      return h("view", {
+        class: `${componentName}`
+      }, (_a = slots.default) == null ? void 0 : _a.call(slots));
+    };
+  }
+});
+export { _sfc_main as default };