@nutui/nutui 3.1.22-beta.5 → 3.1.23-beta.1

package/dist/packages/_es/GridItem.js

@@ -1,39 +1,150 @@
 /*!
-* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.23-beta.1 Mon Jun 27 2022 21:39:05 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { inject as e, getCurrentInstance as t, onUnmounted as o, computed as r, ref as n, resolveComponent as i, openBlock as l, createElementBlock as c, normalizeClass as s, normalizeStyle as a, createElementVNode as u, renderSlot as p, Fragment as m, createBlock as d, toDisplayString as f } from "vue";
-import { u as g } from "./index.js";
-import { c as y } from "./component.js";
-import { p as $ } from "./pxCheck.js";
-import { G as k } from "./common.js";
-import { _ as x } from "./plugin-vue_export-helper.js";
+import { inject, getCurrentInstance, onUnmounted, computed, ref, resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, Fragment, createBlock, toDisplayString } from "vue";
+import { u as useRouter } from "./index.js";
+import { c as createComponent } from "./component.js";
+import { p as pxCheck } from "./pxCheck.js";
+import { G as GRID_KEY } from "./common.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { create: C, componentName: S } = y("grid-item"), v = C({ props: { text: { type: String }, icon: { type: String }, iconSize: { type: [Number, String] }, iconColor: { type: String }, to: { type: [String, Object] }, url: { type: String, default: "" }, replace: { type: Boolean, default: false } }, emits: ["click"], setup(i2, { emit: l2 }) {
-  const c2 = function(i3) {
-    const l3 = e(i3, null);
-    if (l3) {
-      const e2 = t(), { add: n2, remove: i4, internalChildren: c3 } = l3;
-      return n2(e2), o(() => i4(e2)), { parent: l3, index: r(() => c3.indexOf(e2)) };
+function useInject(key) {
+  const parent = inject(key, null);
+  if (parent) {
+    const instance = getCurrentInstance();
+    const { add, remove, internalChildren } = parent;
+    add(instance);
+    onUnmounted(() => remove(instance));
+    const index2 = computed(() => internalChildren.indexOf(instance));
+    return {
+      parent,
+      index: index2
+    };
+  }
+  return {
+    parent: null,
+    index: ref(-1)
+  };
+}
+const { create, componentName } = createComponent("grid-item");
+const _sfc_main = create({
+  props: {
+    text: {
+      type: String
+    },
+    icon: {
+      type: String
+    },
+    iconSize: {
+      type: [Number, String]
+    },
+    iconColor: {
+      type: String
+    },
+    to: {
+      type: [String, Object]
+    },
+    url: {
+      type: String,
+      default: ""
+    },
+    replace: {
+      type: Boolean,
+      default: false
     }
-    return { parent: null, index: n(-1) };
-  }(k);
-  if (!c2.parent)
-    return;
-  const s2 = c2.index, a2 = c2.parent.props, u2 = r(() => ({ [S]: true })), p2 = r(() => {
-    const e2 = { flexBasis: 100 / +a2.columnNum + "%" };
-    return a2.square ? e2.paddingTop = 100 / +a2.columnNum + "%" : a2.gutter && (e2.paddingRight = $(a2.gutter), s2.value >= a2.columnNum && (e2.marginTop = $(a2.gutter))), e2;
-  }), m2 = r(() => {
-    const e2 = `${S}__content`;
-    return { [`${e2}`]: true, [`${e2}--border`]: a2.border, [`${e2}--surround`]: a2.border && a2.gutter, [`${e2}--center`]: a2.center, [`${e2}--square`]: a2.square, [`${e2}--reverse`]: a2.reverse, [`${e2}--${a2.direction}`]: !!a2.direction, [`${e2}--clickable`]: a2.clickable || i2.to || i2.url };
-  }), d2 = r(() => ({ name: i2.icon, size: i2.iconSize || a2.iconSize, color: i2.iconColor || a2.iconColor })), f2 = g();
-  return { rootClass: u2, rootStyle: p2, contentClass: m2, iconProps: d2, handleClick: (e2) => {
-    l2("click", e2), i2.to && f2 ? f2[i2.replace ? "replace" : "push"](i2.to) : i2.url && (i2.replace ? location.replace(i2.url) : location.href = i2.url);
-  } };
-} }), h = { key: 3, class: "nut-grid-item__text" };
-var b = x(v, [["render", function(e2, t2, o2, r2, n2, g2) {
-  const y2 = i("nut-icon");
-  return l(), c("view", { class: s(e2.rootClass), style: a(e2.rootStyle), onClick: t2[0] || (t2[0] = (...t3) => e2.handleClick && e2.handleClick(...t3)) }, [u("view", { class: s(e2.contentClass) }, [e2.$slots.default ? p(e2.$slots, "default", { key: 0 }) : (l(), c(m, { key: 1 }, [e2.$slots.icon ? p(e2.$slots, "icon", { key: 0 }) : (l(), d(y2, { key: 1, name: e2.iconProps.name, size: e2.iconProps.size, color: e2.iconProps.color }, null, 8, ["name", "size", "color"])), e2.$slots.text ? p(e2.$slots, "text", { key: 2 }) : (l(), c("view", h, f(e2.text), 1))], 64))], 2)], 6);
-}]]);
-export { b as default };
+  },
+  emits: ["click"],
+  setup(props, { emit }) {
+    const Parent = useInject(GRID_KEY);
+    if (!Parent.parent)
+      return;
+    const index2 = Parent.index;
+    const parent = Parent.parent.props;
+    const rootClass = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true
+      };
+    });
+    const rootStyle = computed(() => {
+      const style = {
+        flexBasis: `${100 / +parent.columnNum}%`
+      };
+      if (parent.square) {
+        style.paddingTop = `${100 / +parent.columnNum}%`;
+      } else if (parent.gutter) {
+        style.paddingRight = pxCheck(parent.gutter);
+        if (index2.value >= parent.columnNum) {
+          style.marginTop = pxCheck(parent.gutter);
+        }
+      }
+      return style;
+    });
+    const contentClass = computed(() => {
+      const prefixCls = `${componentName}__content`;
+      return {
+        [`${prefixCls}`]: true,
+        [`${prefixCls}--border`]: parent.border,
+        [`${prefixCls}--surround`]: parent.border && parent.gutter,
+        [`${prefixCls}--center`]: parent.center,
+        [`${prefixCls}--square`]: parent.square,
+        [`${prefixCls}--reverse`]: parent.reverse,
+        [`${prefixCls}--${parent.direction}`]: !!parent.direction,
+        [`${prefixCls}--clickable`]: parent.clickable || props.to || props.url
+      };
+    });
+    const iconProps = computed(() => {
+      return {
+        name: props.icon,
+        size: props.iconSize || parent.iconSize,
+        color: props.iconColor || parent.iconColor
+      };
+    });
+    const router = useRouter();
+    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 {
+      rootClass,
+      rootStyle,
+      contentClass,
+      iconProps,
+      handleClick
+    };
+  }
+});
+const _hoisted_1 = {
+  key: 3,
+  class: "nut-grid-item__text"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_nut_icon = resolveComponent("nut-icon");
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.rootClass),
+    style: normalizeStyle(_ctx.rootStyle),
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+  }, [
+    createElementVNode("view", {
+      class: normalizeClass(_ctx.contentClass)
+    }, [
+      _ctx.$slots.default ? renderSlot(_ctx.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+        _ctx.$slots.icon ? renderSlot(_ctx.$slots, "icon", { key: 0 }) : (openBlock(), createBlock(_component_nut_icon, {
+          key: 1,
+          name: _ctx.iconProps.name,
+          size: _ctx.iconProps.size,
+          color: _ctx.iconProps.color
+        }, null, 8, ["name", "size", "color"])),
+        _ctx.$slots.text ? renderSlot(_ctx.$slots, "text", { key: 2 }) : (openBlock(), createElementBlock("view", _hoisted_1, toDisplayString(_ctx.text), 1))
+      ], 64))
+    ], 2)
+  ], 6);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };

package/dist/packages/_es/Icon.js

@@ -1,20 +1,45 @@
 /*!
-* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.23-beta.1 Mon Jun 27 2022 21:39:05 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { h as t } from "vue";
-import { c as e } from "./component.js";
-import { p as i } from "./pxCheck.js";
+import { h } from "vue";
+import { c as createComponent } from "./component.js";
+import { p as pxCheck } from "./pxCheck.js";
 import "../locale/lang";
-const { componentName: n, create: o } = e("icon"), a = o({ props: { name: { type: String, default: "" }, size: { type: [String, Number], default: "" }, classPrefix: { type: String, default: "nut-icon" }, fontClassName: { type: String, default: "nutui-iconfont" }, color: { type: String, default: "" }, tag: { type: String, default: "i" } }, emits: ["click"], setup(e2, { emit: o2, slots: a2 }) {
-  const s = (t2) => {
-    o2("click", t2);
-  };
-  return () => {
-    var _a;
-    const o3 = !!e2.name && e2.name.indexOf("/") !== -1;
-    return t(o3 ? "img" : e2.tag, { class: o3 ? `${n}__img` : `${e2.fontClassName} ${n} ${e2.classPrefix}-${e2.name}`, style: { color: e2.color, fontSize: i(e2.size), width: i(e2.size), height: i(e2.size) }, onClick: s, src: o3 ? e2.name : "" }, (_a = a2.default) == null ? void 0 : _a.call(a2));
-  };
-} });
-export { a as default };
+const { componentName, create } = createComponent("icon");
+const _sfc_main = create({
+  props: {
+    name: { type: String, default: "" },
+    size: { type: [String, Number], default: "" },
+    classPrefix: { type: String, default: "nut-icon" },
+    fontClassName: { type: String, default: "nutui-iconfont" },
+    color: { type: String, default: "" },
+    tag: { type: String, default: "i" }
+  },
+  emits: ["click"],
+  setup(props, { emit, slots }) {
+    const handleClick = (event) => {
+      emit("click", event);
+    };
+    const isImage = () => {
+      return props.name ? props.name.indexOf("/") !== -1 : false;
+    };
+    return () => {
+      var _a;
+      const _isImage = isImage();
+      return h(_isImage ? "img" : props.tag, {
+        class: _isImage ? `${componentName}__img` : `${props.fontClassName} ${componentName} ${props.classPrefix}-${props.name}`,
+        style: {
+          color: props.color,
+          fontSize: pxCheck(props.size),
+          width: pxCheck(props.size),
+          height: pxCheck(props.size)
+        },
+        onClick: handleClick,
+        src: _isImage ? props.name : ""
+      }, (_a = slots.default) == null ? void 0 : _a.call(slots));
+    };
+  }
+});
+export { _sfc_main as default };

package/dist/packages/_es/Image.js

@@ -1,31 +1,142 @@
 /*!
-* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.23-beta.1 Mon Jun 27 2022 21:39:05 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { reactive as r, useSlots as o, computed as e, watch as t, toRefs as i, resolveComponent as l, openBlock as s, createElementBlock as a, normalizeClass as n, normalizeStyle as d, createElementVNode as g, createBlock as c, createCommentVNode as u, renderSlot as m } from "vue";
-import { c as p } from "./component.js";
-import { p as f } from "./pxCheck.js";
-import { _ as y } from "./plugin-vue_export-helper.js";
+import { reactive, useSlots, computed, watch, toRefs, resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, createBlock, createCommentVNode, renderSlot } from "vue";
+import { c as createComponent } from "./component.js";
+import { p as pxCheck } from "./pxCheck.js";
+import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { componentName: h, create: k } = p("image"), w = k({ props: { src: String, fit: { type: String, default: "fill" }, position: { type: String, default: "center" }, alt: { type: String, default: "" }, width: { type: String, default: "center" }, height: { type: String, default: "" }, round: { type: Boolean, default: false }, radius: [String, Number], showError: { type: Boolean, default: true }, showLoading: { type: Boolean, default: true } }, emits: ["click", "load", "error"], setup(l2, { emit: s2 }) {
-  const a2 = r({ loading: true, isError: false, slotLoding: o().loading, slotError: o().error }), n2 = e(() => ({ [h]: true, [`${h}-round`]: l2.round })), d2 = e(() => {
-    let r2 = {};
-    return l2.width && (r2.width = f(l2.width)), l2.height && (r2.height = f(l2.height)), l2.radius !== void 0 && l2.radius !== null && (r2.overflow = "hidden", r2.borderRadius = f(l2.radius)), r2;
-  }), g2 = e(() => ({ objectFit: l2.fit, objectPosition: l2.position }));
-  t(() => l2.src, (r2) => {
-    a2.isError = false, a2.loading = true;
-  });
-  return { ...i(a2), imageClick: (r2) => {
-    s2("click", r2);
-  }, classes: n2, styles: g2, stylebox: d2, error: () => {
-    a2.isError = true, a2.loading = false, s2("error");
-  }, load: () => {
-    a2.loading = false, s2("load");
-  } };
-} }), v = ["src", "alt"], E = { key: 0, class: "nut-img-loading" }, S = { key: 1, class: "nut-img-error" };
-var b = y(w, [["render", function(r2, o2, e2, t2, i2, p2) {
-  const f2 = l("nut-icon");
-  return s(), a("view", { class: n(r2.classes), style: d(r2.stylebox), onClick: o2[2] || (o2[2] = (...o3) => r2.imageClick && r2.imageClick(...o3)) }, [g("img", { class: "nut-img", src: r2.src, alt: r2.alt, onLoad: o2[0] || (o2[0] = (...o3) => r2.load && r2.load(...o3)), onError: o2[1] || (o2[1] = (...o3) => r2.error && r2.error(...o3)), style: d(r2.styles) }, null, 44, v), r2.loading ? (s(), a("view", E, [r2.slotLoding ? u("", true) : (s(), c(f2, { key: 0, name: "image" })), m(r2.$slots, "loading")])) : u("", true), r2.isError && !r2.loading ? (s(), a("view", S, [r2.slotError ? u("", true) : (s(), c(f2, { key: 0, name: "image-error" })), m(r2.$slots, "error")])) : u("", true)], 6);
-}]]);
-export { b as default };
+const { componentName, create } = createComponent("image");
+const _sfc_main = create({
+  props: {
+    src: String,
+    fit: {
+      type: String,
+      default: "fill"
+    },
+    position: {
+      type: String,
+      default: "center"
+    },
+    alt: {
+      type: String,
+      default: ""
+    },
+    width: {
+      type: String,
+      default: "center"
+    },
+    height: {
+      type: String,
+      default: ""
+    },
+    round: {
+      type: Boolean,
+      default: false
+    },
+    radius: [String, Number],
+    showError: {
+      type: Boolean,
+      default: true
+    },
+    showLoading: {
+      type: Boolean,
+      default: true
+    }
+  },
+  emits: ["click", "load", "error"],
+  setup(props, { emit }) {
+    const state = reactive({
+      loading: true,
+      isError: false,
+      slotLoding: useSlots().loading,
+      slotError: useSlots().error
+    });
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true,
+        [`${prefixCls}-round`]: props.round
+      };
+    });
+    const stylebox = computed(() => {
+      let style = {};
+      if (props.width)
+        style.width = pxCheck(props.width);
+      if (props.height)
+        style.height = pxCheck(props.height);
+      if (props.radius !== void 0 && props.radius !== null) {
+        style.overflow = "hidden";
+        style.borderRadius = pxCheck(props.radius);
+      }
+      return style;
+    });
+    const styles = computed(() => {
+      let styless = {
+        objectFit: props.fit,
+        objectPosition: props.position
+      };
+      return styless;
+    });
+    watch(() => props.src, (val) => {
+      state.isError = false, state.loading = true;
+    });
+    const load = () => {
+      state.loading = false;
+      emit("load");
+    };
+    const error = () => {
+      state.isError = true;
+      state.loading = false;
+      emit("error");
+    };
+    const imageClick = (event) => {
+      emit("click", event);
+    };
+    return { ...toRefs(state), imageClick, classes, styles, stylebox, error, load };
+  }
+});
+const _hoisted_1 = ["src", "alt"];
+const _hoisted_2 = {
+  key: 0,
+  class: "nut-img-loading"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "nut-img-error"
+};
+function _sfc_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.stylebox),
+    onClick: _cache[2] || (_cache[2] = (...args) => _ctx.imageClick && _ctx.imageClick(...args))
+  }, [
+    createElementVNode("img", {
+      class: "nut-img",
+      src: _ctx.src,
+      alt: _ctx.alt,
+      onLoad: _cache[0] || (_cache[0] = (...args) => _ctx.load && _ctx.load(...args)),
+      onError: _cache[1] || (_cache[1] = (...args) => _ctx.error && _ctx.error(...args)),
+      style: normalizeStyle(_ctx.styles)
+    }, null, 44, _hoisted_1),
+    _ctx.loading ? (openBlock(), createElementBlock("view", _hoisted_2, [
+      !_ctx.slotLoding ? (openBlock(), createBlock(_component_nut_icon, {
+        key: 0,
+        name: "image"
+      })) : createCommentVNode("", true),
+      renderSlot(_ctx.$slots, "loading")
+    ])) : createCommentVNode("", true),
+    _ctx.isError && !_ctx.loading ? (openBlock(), createElementBlock("view", _hoisted_3, [
+      !_ctx.slotError ? (openBlock(), createBlock(_component_nut_icon, {
+        key: 0,
+        name: "image-error"
+      })) : createCommentVNode("", true),
+      renderSlot(_ctx.$slots, "error")
+    ])) : createCommentVNode("", true)
+  ], 6);
+}
+var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export { index as default };