@nutui/nutui 3.1.0 → 3.1.2-3.beta-4

package/dist/packages/_es/Cell.js

@@ -0,0 +1,113 @@
+/*!
+* @nutui/nutui v3.1.23.beta-4 Mon Jul 25 2022 22:38:45 GMT+0800 (中国标准时间)
+* (c) 2022 @jdf2e.
+* Released under the MIT License.
+*/
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, createBlock, createCommentVNode, Fragment, createElementVNode, toDisplayString, createTextVNode, computed } from "vue";
+import { c as createComponent } from "./component.js";
+import { u as useRouter } from "./index.js";
+import { p as pxCheck } from "./pxCheck.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import "../locale/lang";
+const _hoisted_1 = {
+  key: 0,
+  class: "nut-cell__icon"
+};
+const _hoisted_2 = {
+  key: 1,
+  class: "nut-cell__title"
+};
+const _hoisted_3 = { class: "title" };
+const _hoisted_4 = { class: "nut-cell__title-desc" };
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_nut_icon = resolveComponent("nut-icon");
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes),
+    style: normalizeStyle(_ctx.baseStyle),
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+  }, [
+    renderSlot(_ctx.$slots, "default", {}, () => [
+      _ctx.icon || _ctx.$slots.icon ? (openBlock(), createElementBlock("view", _hoisted_1, [
+        renderSlot(_ctx.$slots, "icon", {}, () => [
+          _ctx.icon ? (openBlock(), createBlock(_component_nut_icon, {
+            key: 0,
+            class: "icon",
+            name: _ctx.icon
+          }, null, 8, ["name"])) : createCommentVNode("", true)
+        ])
+      ])) : createCommentVNode("", true),
+      _ctx.title || _ctx.subTitle || _ctx.$slots.title ? (openBlock(), createElementBlock("view", _hoisted_2, [
+        _ctx.subTitle ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+          renderSlot(_ctx.$slots, "title", {}, () => [
+            createElementVNode("view", _hoisted_3, toDisplayString(_ctx.title), 1)
+          ]),
+          createElementVNode("view", _hoisted_4, toDisplayString(_ctx.subTitle), 1)
+        ], 64)) : renderSlot(_ctx.$slots, "title", { key: 1 }, () => [
+          createTextVNode(toDisplayString(_ctx.title), 1)
+        ])
+      ])) : createCommentVNode("", true),
+      _ctx.desc ? (openBlock(), createElementBlock("view", {
+        key: 2,
+        class: normalizeClass(["nut-cell__value", { "nut-cell__value--alone": !_ctx.title && !_ctx.subTitle && !_ctx.$slots.title }]),
+        style: normalizeStyle({ "text-align": _ctx.descTextAlign })
+      }, toDisplayString(_ctx.desc), 7)) : createCommentVNode("", true),
+      renderSlot(_ctx.$slots, "link", {}, () => [
+        _ctx.isLink || _ctx.to ? (openBlock(), createBlock(_component_nut_icon, {
+          key: 0,
+          class: "nut-cell__link",
+          name: "right"
+        })) : createCommentVNode("", true)
+      ])
+    ])
+  ], 6);
+}
+const { componentName, create } = createComponent("cell");
+const _sfc_main = create({
+  props: {
+    title: { type: String, default: "" },
+    subTitle: { type: String, default: "" },
+    desc: { type: String, default: "" },
+    descTextAlign: { type: String, default: "right" },
+    isLink: { type: Boolean, default: false },
+    to: [String, Object],
+    replace: { type: Boolean, default: false },
+    roundRadius: { type: [String, Number], default: "" },
+    url: { type: String, default: "" },
+    icon: { type: String, default: "" },
+    center: { type: Boolean, default: false },
+    size: { type: String, default: "" }
+  },
+  emits: ["click"],
+  setup(props, { emit }) {
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true,
+        [`${prefixCls}--clickable`]: props.isLink || props.to,
+        [`${prefixCls}--center`]: props.center,
+        [`${prefixCls}--large`]: props.size == "large"
+      };
+    });
+    const router = useRouter();
+    const baseStyle = computed(() => {
+      return {
+        borderRadius: pxCheck(props.roundRadius)
+      };
+    });
+    const handleClick = (event) => {
+      emit("click", event);
+      if (props.to && router) {
+        router[props.replace ? "replace" : "push"](props.to);
+      } else if (props.url) {
+        props.replace ? location.replace(props.url) : location.href = props.url;
+      }
+    };
+    return {
+      handleClick,
+      classes,
+      baseStyle
+    };
+  }
+});
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", render]]);
+export { index as default };

package/dist/packages/_es/CellGroup.js

@@ -0,0 +1,49 @@
+/*!
+* @nutui/nutui v3.1.23.beta-4 Mon Jul 25 2022 22:38:45 GMT+0800 (中国标准时间)
+* (c) 2022 @jdf2e.
+* Released under the MIT License.
+*/
+import { computed, openBlock, createElementBlock, normalizeClass, renderSlot, toDisplayString, createCommentVNode, createElementVNode } from "vue";
+import { c as createComponent } from "./component.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import "../locale/lang";
+const { componentName, create } = createComponent("cell-group");
+const _sfc_main = create({
+  props: {
+    title: { type: String, default: "" },
+    desc: { type: String, default: "" }
+  },
+  setup() {
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true
+      };
+    });
+    return {
+      classes
+    };
+  }
+});
+const _hoisted_1 = {
+  key: 1,
+  class: "nut-cell-group__title"
+};
+const _hoisted_2 = {
+  key: 3,
+  class: "nut-cell-group__desc"
+};
+const _hoisted_3 = { class: "nut-cell-group__warp" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes)
+  }, [
+    _ctx.$slots.title ? renderSlot(_ctx.$slots, "title", { key: 0 }) : _ctx.title ? (openBlock(), createElementBlock("view", _hoisted_1, toDisplayString(_ctx.title), 1)) : createCommentVNode("", true),
+    _ctx.$slots.desc ? renderSlot(_ctx.$slots, "desc", { key: 2 }) : _ctx.desc ? (openBlock(), createElementBlock("view", _hoisted_2, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
+    createElementVNode("view", _hoisted_3, [
+      renderSlot(_ctx.$slots, "default")
+    ])
+  ], 2);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };

package/dist/packages/_es/Checkbox.js

@@ -0,0 +1,152 @@
+/*!
+* @nutui/nutui v3.1.23.beta-4 Mon Jul 25 2022 22:38:45 GMT+0800 (中国标准时间)
+* (c) 2022 @jdf2e.
+* Released under the MIT License.
+*/
+import { c as createComponent } from "./component.js";
+import { inject, reactive, computed, watch, onMounted, getCurrentInstance, h } from "vue";
+import _sfc_main$1 from "./Icon.js";
+import "../locale/lang";
+import "./pxCheck.js";
+const component = (componentName2, nutIcon) => {
+  return {
+    components: {
+      nutIcon
+    },
+    props: {
+      modelValue: {
+        type: Boolean,
+        default: false
+      },
+      disabled: {
+        type: Boolean,
+        default: false
+      },
+      textPosition: {
+        type: String,
+        default: "right"
+      },
+      iconSize: {
+        type: [String, Number],
+        default: ""
+      },
+      iconName: {
+        type: String,
+        default: "check-normal"
+      },
+      iconActiveName: {
+        type: String,
+        default: "checked"
+      },
+      iconIndeterminateName: {
+        type: String,
+        default: "check-disabled"
+      },
+      label: {
+        type: String,
+        default: ""
+      },
+      iconClassPrefix: {
+        type: String,
+        default: "nut-icon"
+      },
+      iconFontClassName: {
+        type: String,
+        default: "nutui-iconfont"
+      },
+      indeterminate: {
+        type: Boolean,
+        default: false
+      }
+    },
+    emits: ["change", "update:modelValue"],
+    setup(props, { emit, slots }) {
+      const parent = inject("parent", null);
+      const state = reactive({
+        partialSelect: props.indeterminate
+      });
+      const hasParent = computed(() => !!parent);
+      const pValue = computed(() => {
+        if (hasParent.value) {
+          return parent.value.value.includes(props.label);
+        } else {
+          return props.modelValue;
+        }
+      });
+      const pDisabled = computed(() => {
+        return hasParent.value ? parent.disabled.value ? parent.disabled.value : props.disabled : props.disabled;
+      });
+      const checked = computed(() => !!props.modelValue);
+      const color = computed(() => {
+        return !pDisabled.value ? !pValue.value ? "nut-checkbox__icon--unchecked" : state.partialSelect ? "nut-checkbox__icon--indeterminate" : "nut-checkbox__icon" : "nut-checkbox__icon--disable";
+      });
+      let updateType = "";
+      const emitChange = (value, label) => {
+        updateType = "click";
+        emit("update:modelValue", value);
+        emit("change", value, label);
+      };
+      watch(() => props.modelValue, (v) => {
+        if (updateType == "click") {
+          updateType = "";
+        } else {
+          emit("change", v);
+        }
+      });
+      const renderIcon = () => {
+        const { iconName, iconSize, iconActiveName, iconClassPrefix, iconFontClassName, iconIndeterminateName } = props;
+        return h(nutIcon, {
+          name: !pValue.value ? iconName : state.partialSelect ? iconIndeterminateName : iconActiveName,
+          size: iconSize,
+          class: color.value,
+          classPrefix: iconClassPrefix,
+          fontClassName: iconFontClassName
+        });
+      };
+      const renderLabel = () => {
+        var _a;
+        return h("view", {
+          class: `${componentName2}__label ${pDisabled.value ? `${componentName2}__label--disabled` : ""}`
+        }, (_a = slots.default) == null ? void 0 : _a.call(slots));
+      };
+      const handleClick = (e) => {
+        var _a, _b;
+        if (pDisabled.value)
+          return;
+        if (checked.value && state.partialSelect) {
+          state.partialSelect = false;
+          emitChange(checked.value, (_a = slots.default) == null ? void 0 : _a.call(slots)[0].children);
+          return;
+        }
+        emitChange(!checked.value, (_b = slots.default) == null ? void 0 : _b.call(slots)[0].children);
+        if (hasParent.value) {
+          let value = parent.value.value;
+          let max = parent.max.value;
+          let { label } = props;
+          const index = value.indexOf(label);
+          if (index > -1) {
+            value.splice(index, 1);
+          } else if (index <= -1 && (value.length < max || !max)) {
+            value.push(label);
+          }
+          parent.updateValue(value);
+        }
+      };
+      onMounted(() => {
+        hasParent.value && parent["relation"](getCurrentInstance());
+      });
+      watch(() => props.indeterminate, (newVal) => {
+        state.partialSelect = newVal;
+      });
+      return () => {
+        return h("view", {
+          class: `${componentName2} ${props.textPosition === "left" ? `${componentName2}--reverse` : ""}`,
+          onClick: handleClick
+        }, [renderIcon(), renderLabel()]);
+      };
+    }
+  };
+};
+const { create, componentName } = createComponent("checkbox");
+const _sfc_main = create(component(componentName, _sfc_main$1));
+export { _sfc_main as default };

package/dist/packages/_es/CheckboxGroup.js

@@ -0,0 +1,84 @@
+/*!
+* @nutui/nutui v3.1.23.beta-4 Mon Jul 25 2022 22:38:45 GMT+0800 (中国标准时间)
+* (c) 2022 @jdf2e.
+* Released under the MIT License.
+*/
+import { reactive, provide, computed, watch, h } from "vue";
+import { c as createComponent } from "./component.js";
+import { u as useExpose } from "./index3.js";
+import "../locale/lang";
+const { create, componentName } = createComponent("checkboxgroup");
+const _sfc_main = create({
+  props: {
+    modelValue: {
+      type: Array,
+      default: () => []
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    max: {
+      type: Number,
+      default: 0
+    }
+  },
+  emits: ["change", "update:modelValue"],
+  setup(props, { slots, emit }) {
+    const state = reactive({
+      children: []
+    });
+    const relation = (child) => {
+      if (child.proxy) {
+        state.children.push(child.proxy);
+      }
+    };
+    const updateValue = (value) => {
+      emit("update:modelValue", value);
+      emit("change", value);
+    };
+    const toggleAll = (checked) => {
+      let values = [];
+      if (!!checked) {
+        state.children.forEach((item) => {
+          if (!(item == null ? void 0 : item.disabled)) {
+            values.push(item == null ? void 0 : item.label);
+          }
+        });
+      }
+      emit("update:modelValue", values);
+    };
+    const toggleReverse = () => {
+      let values = props.modelValue.slice();
+      state.children.forEach((item) => {
+        let findIndex = values.findIndex((value) => value === item.label);
+        if (findIndex > -1) {
+          values.splice(findIndex, 1);
+        } else {
+          if (!(item == null ? void 0 : item.disabled)) {
+            values.push(item == null ? void 0 : item.label);
+          }
+        }
+      });
+      emit("update:modelValue", values);
+    };
+    provide("parent", {
+      value: computed(() => props.modelValue),
+      disabled: computed(() => props.disabled),
+      max: computed(() => props.max),
+      updateValue,
+      relation
+    });
+    watch(() => props.modelValue, (value) => {
+      emit("change", value);
+    });
+    useExpose({ toggleAll, toggleReverse });
+    return () => {
+      var _a;
+      return h("view", {
+        class: `${componentName}`
+      }, (_a = slots.default) == null ? void 0 : _a.call(slots));
+    };
+  }
+});
+export { _sfc_main as default };

package/dist/packages/_es/CircleProgress.js

@@ -0,0 +1,155 @@
+/*!
+* @nutui/nutui v3.1.23.beta-4 Mon Jul 25 2022 22:38:45 GMT+0800 (中国标准时间)
+* (c) 2022 @jdf2e.
+* Released under the MIT License.
+*/
+import { useSlots, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, Fragment, renderList, renderSlot, toDisplayString, createCommentVNode } from "vue";
+import { i as isObject, c as createComponent } from "./component.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import "../locale/lang";
+const { componentName, create } = createComponent("circleprogress");
+const _sfc_main = create({
+  props: {
+    progress: {
+      type: [Number, String],
+      required: true
+    },
+    strokeWidth: {
+      type: [Number, String],
+      default: 5
+    },
+    radius: {
+      type: [Number, String],
+      default: 50
+    },
+    strokeLinecap: {
+      type: String,
+      default: "round"
+    },
+    color: {
+      type: [String, Object],
+      default: ""
+    },
+    pathColor: {
+      type: String,
+      default: ""
+    },
+    clockwise: {
+      type: Boolean,
+      default: true
+    }
+  },
+  setup(props, { emit }) {
+    const slotDefault = !!useSlots().default;
+    const refRandomId = Math.random().toString(36).slice(-8);
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true
+      };
+    });
+    const path = computed(() => {
+      const isWise = props.clockwise ? 1 : 0;
+      return `M 50 50 m 0 -45 a 45 45 0 1 ${isWise} 0 90 a 45 45 0 1, ${isWise} 0 -90`;
+    });
+    const hoverColor = computed(() => {
+      return isObject(props.color) ? `url(#${refRandomId})` : props.color;
+    });
+    const hoverStyle = computed(() => {
+      let perimeter = 283;
+      let offset = perimeter * Number(props.progress) / 100;
+      return {
+        stroke: isObject(props.color) ? `url(#${refRandomId})` : props.color,
+        strokeDasharray: `${offset}px ${perimeter}px`
+      };
+    });
+    const pathStyle = computed(() => {
+      return {
+        stroke: props.pathColor
+      };
+    });
+    const stop = computed(() => {
+      if (!isObject(props.color)) {
+        return;
+      }
+      let color = props.color;
+      const colorArr = Object.keys(color).sort((a, b) => parseFloat(a) - parseFloat(b));
+      let stopArr = [];
+      colorArr.map((item, index2) => {
+        let obj = {
+          key: "",
+          value: ""
+        };
+        obj.key = item;
+        obj.value = color[item];
+        stopArr.push(obj);
+      });
+      return stopArr;
+    });
+    return {
+      classes,
+      hoverStyle,
+      pathStyle,
+      path,
+      hoverColor,
+      stop,
+      slotDefault,
+      refRandomId
+    };
+  }
+});
+const _hoisted_1 = { viewBox: "0 0 100 100" };
+const _hoisted_2 = ["id"];
+const _hoisted_3 = ["offset", "stop-color"];
+const _hoisted_4 = ["d", "stroke-width"];
+const _hoisted_5 = ["d", "stroke", "stroke-linecap", "stroke-width"];
+const _hoisted_6 = { class: "nut-circleprogress-text" };
+const _hoisted_7 = { key: 0 };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(_ctx.classes),
+    style: normalizeStyle({ height: _ctx.radius * 2 + "px", width: _ctx.radius * 2 + "px" })
+  }, [
+    (openBlock(), createElementBlock("svg", _hoisted_1, [
+      createElementVNode("defs", null, [
+        createElementVNode("linearGradient", {
+          id: _ctx.refRandomId,
+          x1: "100%",
+          y1: "0%",
+          x2: "0%",
+          y2: "0%"
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.stop, (item, index2) => {
+            return openBlock(), createElementBlock("stop", {
+              key: index2,
+              offset: item.key,
+              "stop-color": item.value
+            }, null, 8, _hoisted_3);
+          }), 128))
+        ], 8, _hoisted_2)
+      ]),
+      createElementVNode("path", {
+        class: "nut-circleprogress-path",
+        style: normalizeStyle(_ctx.pathStyle),
+        d: _ctx.path,
+        fill: "none",
+        "stroke-width": _ctx.strokeWidth
+      }, " > ", 12, _hoisted_4),
+      createElementVNode("path", {
+        class: "nut-circleprogress-hover",
+        style: normalizeStyle(_ctx.hoverStyle),
+        d: _ctx.path,
+        fill: "none",
+        stroke: _ctx.hoverColor,
+        "stroke-linecap": _ctx.strokeLinecap,
+        "stroke-width": _ctx.strokeWidth
+      }, null, 12, _hoisted_5)
+    ])),
+    createElementVNode("div", _hoisted_6, [
+      renderSlot(_ctx.$slots, "default"),
+      !_ctx.slotDefault ? (openBlock(), createElementBlock("div", _hoisted_7, toDisplayString(_ctx.progress) + "%", 1)) : createCommentVNode("", true)
+    ])
+  ], 6);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };

package/dist/packages/_es/Col.js

@@ -0,0 +1,61 @@
+/*!
+* @nutui/nutui v3.1.23.beta-4 Mon Jul 25 2022 22:38:45 GMT+0800 (中国标准时间)
+* (c) 2022 @jdf2e.
+* Released under the MIT License.
+*/
+import { inject, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot } from "vue";
+import { c as createComponent } from "./component.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import "../locale/lang";
+const { componentName, create } = createComponent("col");
+const _sfc_main = create({
+  props: {
+    span: {
+      type: [String, Number],
+      default: "24"
+    },
+    offset: {
+      type: [String, Number],
+      default: "0"
+    }
+  },
+  emits: ["click"],
+  setup(props, { emit }) {
+    const prefixCls = componentName;
+    const gutter = inject("gutter");
+    const classes = computed(() => {
+      return {
+        [prefixCls]: true,
+        [prefixCls + "-gutter"]: gutter,
+        ["nut-col-" + props.span]: true,
+        ["nut-col-offset-" + props.offset]: true
+      };
+    });
+    const style = computed(() => {
+      return {
+        paddingLeft: gutter / 2 + "px",
+        paddingRight: gutter / 2 + "px"
+      };
+    });
+    const handleClick = (evt) => {
+      evt.stopPropagation();
+      emit("click", evt);
+    };
+    return {
+      classes,
+      style,
+      handleClick
+    };
+  }
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes),
+    style: normalizeStyle(_ctx.style),
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+  }, [
+    renderSlot(_ctx.$slots, "default")
+  ], 6);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };