@nutui/nutui 4.0.12-beta.1 → 4.0.12

package/dist/packages/_es/Col.js

@@ -1,8 +1,9 @@
-import { inject as c, computed as n, openBlock as a, createElementBlock as p, normalizeClass as l, normalizeStyle as u, renderSlot as f } from "vue";
-import { c as i } from "./component-234624bc.js";
-import { _ as m } from "./_plugin-vue_export-helper-dad06003.js";
+import { inject, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot } from "vue";
+import { c as createComponent } from "./component-81a4c1d0.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
 import "../locale/lang";
-const { componentName: d, create: g } = i("col"), y = g({
+const { componentName, create } = createComponent("col");
+const _sfc_main = create({
   props: {
     span: {
       type: [String, Number],
@@ -14,31 +15,38 @@ const { componentName: d, create: g } = i("col"), y = g({
     }
   },
   emits: [],
-  setup(e) {
-    const r = d, t = c("gutter"), s = n(() => ({
-      [r]: !0,
-      [r + "-gutter"]: t,
-      ["nut-col-" + e.span]: !0,
-      ["nut-col-offset-" + e.offset]: !0
-    })), o = n(() => ({
-      paddingLeft: t / 2 + "px",
-      paddingRight: t / 2 + "px"
-    }));
+  setup(props) {
+    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"
+      };
+    });
     return {
-      classes: s,
-      style: o
+      classes,
+      style
     };
   }
 });
-function _(e, r, t, s, o, $) {
-  return a(), p("view", {
-    class: l(e.classes),
-    style: u(e.style)
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes),
+    style: normalizeStyle(_ctx.style)
   }, [
-    f(e.$slots, "default")
+    renderSlot(_ctx.$slots, "default")
   ], 6);
 }
-const b = /* @__PURE__ */ m(y, [["render", _]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  b as default
+  index as default
 };

package/dist/packages/_es/Collapse.js

@@ -1,8 +1,9 @@
-import { ref as u, computed as i, watch as d, provide as f, openBlock as p, createElementBlock as m, normalizeClass as v, renderSlot as V } from "vue";
-import { c as y } from "./component-234624bc.js";
-import { _ } from "./_plugin-vue_export-helper-dad06003.js";
+import { ref, computed, watch, provide, openBlock, createElementBlock, normalizeClass, renderSlot } from "vue";
+import { c as createComponent } from "./component-81a4c1d0.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
 import "../locale/lang";
-const { create: x, componentName: h } = y("collapse"), w = x({
+const { create, componentName } = createComponent("collapse");
+const _sfc_main = create({
   props: {
     modelValue: {
       type: [String, Number, Array],
@@ -10,48 +11,72 @@ const { create: x, componentName: h } = y("collapse"), w = x({
     },
     accordion: {
       type: Boolean,
-      default: !1
+      default: false
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(a, { emit: t }) {
-    const c = u(null), l = u(a.modelValue || (a.accordion ? "" : [])), n = i(() => ({
-      [h]: !0
-    }));
-    d(() => a.modelValue, (e) => {
-      l.value = e;
+  setup(props, { emit }) {
+    const collapseDom = ref(null);
+    const innerValue = ref(props.modelValue || (props.accordion ? "" : []));
+    const classes = computed(() => {
+      const prefixCls = componentName;
+      return {
+        [prefixCls]: true
+      };
     });
-    const o = (e, r, s = !0) => {
-      l.value = e, t("update:modelValue", e), t("change", e, r, s);
+    watch(() => props.modelValue, (val) => {
+      innerValue.value = val;
+    });
+    const changeVal = (val, name, status = true) => {
+      innerValue.value = val;
+      emit("update:modelValue", val);
+      emit("change", val, name, status);
     };
-    return f("collapseParent", {
-      updateVal: (e) => {
-        if (a.accordion)
-          l.value === e ? o("", e, !1) : o(e, e, !0);
-        else if (Array.isArray(l.value))
-          if (l.value.includes(e)) {
-            const r = l.value.filter((s) => s !== e);
-            o(r, e, !1);
+    const updateVal = (name) => {
+      if (props.accordion) {
+        if (innerValue.value === name) {
+          changeVal("", name, false);
+        } else {
+          changeVal(name, name, true);
+        }
+      } else {
+        if (Array.isArray(innerValue.value)) {
+          if (innerValue.value.includes(name)) {
+            const newValue = innerValue.value.filter((v) => v !== name);
+            changeVal(newValue, name, false);
           } else {
-            const r = l.value.concat([e]);
-            o(r, e, !0);
+            const newValue = innerValue.value.concat([name]);
+            changeVal(newValue, name, true);
           }
-        else
+        } else {
           console.warn("[NutUI] <Collapse> 未开启手风琴模式时 v-model 应为数组");
-      },
-      isExpanded: (e) => a.accordion ? l.value === e : Array.isArray(l.value) ? l.value.includes(e) : !1
-    }), { collapseDom: c, classes: n };
+        }
+      }
+    };
+    const isExpanded = (name) => {
+      if (props.accordion) {
+        return innerValue.value === name;
+      } else if (Array.isArray(innerValue.value)) {
+        return innerValue.value.includes(name);
+      }
+      return false;
+    };
+    provide("collapseParent", {
+      updateVal,
+      isExpanded
+    });
+    return { collapseDom, classes };
   }
 });
-function A(a, t, c, l, n, o) {
-  return p(), m("view", {
-    class: v(a.classes),
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes),
     ref: "collapseDom"
   }, [
-    V(a.$slots, "default")
+    renderSlot(_ctx.$slots, "default")
   ], 2);
 }
-const k = /* @__PURE__ */ _(w, [["render", A]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  k as default
+  index as default
 };

package/dist/packages/_es/CollapseItem.js

@@ -1,10 +1,11 @@
-import { ref as d, inject as k, reactive as H, computed as g, watch as S, openBlock as n, createElementBlock as i, normalizeClass as m, createElementVNode as o, renderSlot as c, toDisplayString as T, createCommentVNode as w, normalizeStyle as h, createBlock as C, resolveDynamicComponent as E } from "vue";
-import { DownArrow as R } from "@nutui/icons-vue";
-import { c as q } from "./component-234624bc.js";
-import { r as A } from "./renderIcon-47498b32.js";
-import { _ as B } from "./_plugin-vue_export-helper-dad06003.js";
+import { ref, inject, reactive, computed, watch, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, toDisplayString, createCommentVNode, normalizeStyle, createBlock, resolveDynamicComponent } from "vue";
+import { DownArrow } from "@nutui/icons-vue";
+import { c as createComponent } from "./component-81a4c1d0.js";
+import { r as renderIcon } from "./renderIcon-3d0fd47c.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
 import "../locale/lang";
-const { create: N, componentName: F } = q("collapse-item"), L = N({
+const { create, componentName } = createComponent("collapse-item");
+const _sfc_main = create({
   props: {
     collapseRef: {
       type: Object
@@ -23,134 +24,163 @@ const { create: N, componentName: F } = q("collapse-item"), L = N({
     },
     disabled: {
       type: Boolean,
-      default: !1
+      default: false
     },
     name: {
       type: [Number, String],
       default: -1,
-      required: !0
+      required: true
     },
     border: {
       type: Boolean,
-      default: !0
+      default: true
     },
     icon: {
       type: Object,
-      default: () => R
+      default: () => DownArrow
     },
     rotate: {
       type: [String, Number],
       default: 180
     }
   },
-  setup(e) {
-    const s = d(null), p = d(null), f = k("collapseParent"), u = H(f), _ = g(() => {
-      const t = F;
+  setup(props) {
+    const wrapperRef = ref(null);
+    const contentRef = ref(null);
+    const collapse = inject("collapseParent");
+    const parent = reactive(collapse);
+    const classes = computed(() => {
+      const prefixCls = componentName;
       return {
-        [t]: !0,
-        [t + "__border"]: e.border
+        [prefixCls]: true,
+        [prefixCls + "__border"]: props.border
       };
-    }), l = g(() => u ? u.isExpanded(e.name) : !1), a = d(l.value ? "auto" : "0px"), y = () => {
-      u.updateVal(e.name);
-    }, b = () => {
-      l.value && (a.value = "auto");
-    }, v = () => {
-      a.value = "0px", requestAnimationFrame(() => {
+    });
+    const expanded = computed(() => {
+      if (parent) {
+        return parent.isExpanded(props.name);
+      }
+      return false;
+    });
+    const wrapperHeight = ref(expanded.value ? "auto" : "0px");
+    const toggle = () => {
+      parent.updateVal(props.name);
+    };
+    const onTransitionEnd = () => {
+      if (expanded.value) {
+        wrapperHeight.value = "auto";
+      }
+    };
+    const open = () => {
+      wrapperHeight.value = "0px";
+      requestAnimationFrame(() => {
         requestAnimationFrame(() => {
-          var r;
-          const t = (r = p.value) == null ? void 0 : r.offsetHeight;
-          a.value = t ? `${t}px` : "auto";
+          var _a;
+          const height = (_a = contentRef.value) == null ? void 0 : _a.offsetHeight;
+          wrapperHeight.value = height ? `${height}px` : "auto";
         });
       });
-    }, $ = () => {
-      var r;
-      const t = (r = p.value) == null ? void 0 : r.offsetHeight;
-      a.value = t ? `${t}px` : "auto", requestAnimationFrame(() => {
+    };
+    const close = () => {
+      var _a;
+      const height = (_a = contentRef.value) == null ? void 0 : _a.offsetHeight;
+      wrapperHeight.value = height ? `${height}px` : "auto";
+      requestAnimationFrame(() => {
         requestAnimationFrame(() => {
-          a.value = "0px";
+          wrapperHeight.value = "0px";
         });
       });
     };
-    return S(l, (t) => {
-      t ? v() : $();
-    }), {
-      classes: _,
-      renderIcon: A,
-      wrapperRef: s,
-      contentRef: p,
-      open: v,
-      toggle: y,
-      wrapperHeight: a,
-      expanded: l,
-      onTransitionEnd: b
+    watch(expanded, (value) => {
+      value ? open() : close();
+    });
+    return {
+      classes,
+      renderIcon,
+      wrapperRef,
+      contentRef,
+      open,
+      toggle,
+      wrapperHeight,
+      expanded,
+      onTransitionEnd
     };
   }
-}), M = { class: "nut-collapse-item__title-main" }, j = { class: "nut-collapse-item__title-main-value" }, D = ["innerHTML"], V = {
+});
+const _hoisted_1 = { class: "nut-collapse-item__title-main" };
+const _hoisted_2 = { class: "nut-collapse-item__title-main-value" };
+const _hoisted_3 = ["innerHTML"];
+const _hoisted_4 = {
   key: 2,
   class: "nut-collapse-item__title-label"
-}, z = {
+};
+const _hoisted_5 = {
   key: 0,
   class: "nut-collapse-item__title-sub"
-}, I = ["innerHTML"], O = {
+};
+const _hoisted_6 = ["innerHTML"];
+const _hoisted_7 = {
   key: 0,
   class: "nut-collapse__item-extraWrapper"
-}, W = { class: "nut-collapse__item-extraWrapper__extraRender" }, P = {
+};
+const _hoisted_8 = { class: "nut-collapse__item-extraWrapper__extraRender" };
+const _hoisted_9 = {
   class: "nut-collapse__item-wrapper__content",
   ref: "contentRef"
 };
-function G(e, s, p, f, u, _) {
-  return n(), i("view", {
-    class: m(e.classes)
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("view", {
+    class: normalizeClass(_ctx.classes)
   }, [
-    o("view", {
-      class: m(["nut-collapse-item__title", { "nut-collapse-item__title--disabled": e.disabled }]),
-      onClick: s[0] || (s[0] = (...l) => e.toggle && e.toggle(...l))
+    createElementVNode("view", {
+      class: normalizeClass(["nut-collapse-item__title", { "nut-collapse-item__title--disabled": _ctx.disabled }]),
+      onClick: _cache[0] || (_cache[0] = (...args) => _ctx.toggle && _ctx.toggle(...args))
     }, [
-      o("view", M, [
-        o("view", j, [
-          e.$slots.title ? c(e.$slots, "title", { key: 0 }) : (n(), i("view", {
+      createElementVNode("view", _hoisted_1, [
+        createElementVNode("view", _hoisted_2, [
+          _ctx.$slots.title ? renderSlot(_ctx.$slots, "title", { key: 0 }) : (openBlock(), createElementBlock("view", {
             key: 1,
-            innerHTML: e.title,
+            innerHTML: _ctx.title,
             class: "nut-collapse-item__title-mtitle"
-          }, null, 8, D)),
-          e.label ? (n(), i("view", V, T(e.label), 1)) : w("", !0)
+          }, null, 8, _hoisted_3)),
+          _ctx.label ? (openBlock(), createElementBlock("view", _hoisted_4, toDisplayString(_ctx.label), 1)) : createCommentVNode("", true)
         ])
       ]),
-      e.$slots.value ? (n(), i("view", z, [
-        c(e.$slots, "value")
-      ])) : (n(), i("view", {
+      _ctx.$slots.value ? (openBlock(), createElementBlock("view", _hoisted_5, [
+        renderSlot(_ctx.$slots, "value")
+      ])) : (openBlock(), createElementBlock("view", {
         key: 1,
-        innerHTML: e.value,
+        innerHTML: _ctx.value,
         class: "nut-collapse-item__title-sub"
-      }, null, 8, I)),
-      o("view", {
-        class: m(["nut-collapse-item__title-icon", { "nut-collapse-item__title-icon--expanded": e.expanded }]),
-        style: h({ transform: "rotate(" + (e.expanded ? e.rotate : 0) + "deg)" })
+      }, null, 8, _hoisted_6)),
+      createElementVNode("view", {
+        class: normalizeClass(["nut-collapse-item__title-icon", { "nut-collapse-item__title-icon--expanded": _ctx.expanded }]),
+        style: normalizeStyle({ transform: "rotate(" + (_ctx.expanded ? _ctx.rotate : 0) + "deg)" })
       }, [
-        (n(), C(E(e.renderIcon(e.icon))))
+        (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderIcon(_ctx.icon))))
       ], 6)
     ], 2),
-    e.$slots.extra ? (n(), i("view", O, [
-      o("div", W, [
-        c(e.$slots, "extra")
+    _ctx.$slots.extra ? (openBlock(), createElementBlock("view", _hoisted_7, [
+      createElementVNode("div", _hoisted_8, [
+        renderSlot(_ctx.$slots, "extra")
       ])
-    ])) : w("", !0),
-    o("view", {
+    ])) : createCommentVNode("", true),
+    createElementVNode("view", {
       class: "nut-collapse__item-wrapper",
       ref: "wrapperRef",
-      style: h({
+      style: normalizeStyle({
         willChange: "height",
-        height: e.wrapperHeight
+        height: _ctx.wrapperHeight
       }),
-      onTransitionend: s[1] || (s[1] = (...l) => e.onTransitionEnd && e.onTransitionEnd(...l))
+      onTransitionend: _cache[1] || (_cache[1] = (...args) => _ctx.onTransitionEnd && _ctx.onTransitionEnd(...args))
     }, [
-      o("view", P, [
-        c(e.$slots, "default")
+      createElementVNode("view", _hoisted_9, [
+        renderSlot(_ctx.$slots, "default")
       ], 512)
     ], 36)
   ], 2);
 }
-const Z = /* @__PURE__ */ B(L, [["render", G]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  Z as default
+  index as default
 };