@nutui/nutui 3.1.22-beta.0 → 3.1.22-beta.3

package/dist/packages/_es/CollapseItem.js

@@ -5,275 +5,84 @@ 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]);
+var __spreadValues = (a2, b2) => {
+  for (var prop in b2 || (b2 = {}))
+    if (__hasOwnProp.call(b2, prop))
+      __defNormalProp(a2, prop, b2[prop]);
   if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
+    for (var prop of __getOwnPropSymbols(b2)) {
+      if (__propIsEnum.call(b2, prop))
+        __defNormalProp(a2, prop, b2[prop]);
     }
-  return a;
+  return a2;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __spreadProps = (a2, b2) => __defProps(a2, __getOwnPropDescs(b2));
 /*!
-* @nutui/nutui v3.1.22-beta.0 Tue May 31 2022 21:47:10 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.22-beta.3 Wed Jun 15 2022 20:12:30 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { inject, reactive, computed, getCurrentInstance, ref, watch, onMounted, nextTick, toRefs, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createBlock, createCommentVNode, renderSlot, normalizeStyle } from "vue";
-import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { inject as e, reactive as o, computed as t, getCurrentInstance as n, ref as l, watch as s, onMounted as i, nextTick as a, toRefs as p, resolveComponent as c, openBlock as r, createElementBlock as d, normalizeClass as u, createElementVNode as m, createBlock as f, createCommentVNode as g, renderSlot as y, normalizeStyle as x } from "vue";
+import { c as v } from "./component.js";
+import { _ as h } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { create, componentName } = createComponent("collapse-item");
-const _sfc_main = create({
-  props: {
-    title: {
-      type: String,
-      default: ""
-    },
-    subTitle: {
-      type: String,
-      default: ""
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    name: {
-      type: [Number, String],
-      default: -1,
-      required: true
-    },
-    collapseRef: {
-      type: Object
+const { create: w, componentName: I } = v("collapse-item"), T = w({ props: { title: { type: String, default: "" }, subTitle: { type: String, default: "" }, disabled: { type: Boolean, default: false }, name: { type: [Number, String], default: -1, required: true }, collapseRef: { type: Object } }, setup(c2, r2) {
+  const d2 = e("collapseParent"), u2 = o(d2), m2 = t(() => ({ [I]: true, [`${I}-icon`]: u2.props.icon }));
+  var f2;
+  (f2 = n()).proxy && u2.children.push(f2.proxy);
+  const g2 = o({ icon: u2.props.icon, iconSize: u2.props.iconSize, iconColor: u2.props.iconColor, openExpanded: false, iconStyle: { transform: "rotate(0deg)", marginTop: u2.props.iconHeght ? "-" + u2.props.iconHeght / 2 + "px" : "-10px" } }), y2 = o({ titleIcon: u2.props.titleIcon, titleIconSize: u2.props.titleIconSize, titleIconColor: u2.props.titleIconColor, titleIconPosition: u2.props.titleIconPosition }), x2 = l(null), v2 = l(null), h2 = () => {
+    const e2 = x2.value, o2 = v2.value;
+    if (!e2 || !o2)
+      return;
+    const t2 = o2.offsetHeight || "auto";
+    if (t2) {
+      const o3 = `${t2}px`;
+      e2.style.willChange = "height", e2.style.height = g2.openExpanded ? o3 : 0, u2.props.icon && !g2.openExpanded ? g2.iconStyle.transform = "rotate(0deg)" : g2.iconStyle.transform = "rotate(" + u2.props.rotate + "deg)";
     }
-  },
-  setup(props, ctx) {
-    const collapse = inject("collapseParent");
-    const parent = reactive(collapse);
-    const classes = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [prefixCls]: true,
-        [`${prefixCls}-icon`]: parent.props.icon
-      };
-    });
-    const relation = (child) => {
-      if (child.proxy) {
-        parent.children.push(child.proxy);
-      }
-    };
-    relation(getCurrentInstance());
-    const proxyData = reactive({
-      icon: parent.props.icon,
-      iconSize: parent.props.iconSize,
-      iconColor: parent.props.iconColor,
-      openExpanded: false,
-      iconStyle: {
-        transform: "rotate(0deg)",
-        marginTop: parent.props.iconHeght ? "-" + parent.props.iconHeght / 2 + "px" : "-10px"
-      }
-    });
-    const titleIconStyle = reactive({
-      titleIcon: parent.props.titleIcon,
-      titleIconSize: parent.props.titleIconSize,
-      titleIconColor: parent.props.titleIconColor,
-      titleIconPosition: parent.props.titleIconPosition
-    });
-    const wrapperRef = ref(null);
-    const contentRef = ref(null);
-    const onTransitionEnd = () => {
-      const wrapperRefEle = document.getElementsByClassName("collapse-wrapper")[0];
-      if (wrapperRefEle) {
-        wrapperRefEle.style.willChange = "auto";
-      }
-    };
-    const animation = () => {
-      const wrapperRefEle = wrapperRef.value;
-      const contentRefEle = contentRef.value;
-      if (!wrapperRefEle || !contentRefEle) {
-        return;
-      }
-      const offsetHeight = contentRefEle.offsetHeight || "auto";
-      if (offsetHeight) {
-        const contentHeight = `${offsetHeight}px`;
-        wrapperRefEle.style.willChange = "height";
-        wrapperRefEle.style.height = !proxyData.openExpanded ? 0 : contentHeight;
-        if (parent.props.icon && !proxyData.openExpanded) {
-          proxyData.iconStyle["transform"] = "rotate(0deg)";
-        } else {
-          proxyData.iconStyle["transform"] = "rotate(" + parent.props.rotate + "deg)";
-        }
-      }
-      if (!proxyData.openExpanded) {
-        onTransitionEnd();
-      }
-    };
-    const open = () => {
-      proxyData.openExpanded = !proxyData.openExpanded;
-      animation();
-    };
-    const defaultOpen = () => {
-      open();
-      if (parent.props.icon) {
-        proxyData["iconStyle"]["transform"] = "rotate(" + parent.props.rotate + "deg)";
-      }
-    };
-    const currentName = computed(() => props.name);
-    const toggleOpen = () => {
-      if (parent.props.accordion) {
-        parent.children.forEach((item, index2) => {
-          if (currentName.value == item.name) {
-            item.changeOpen(!item.openExpanded);
-          } else {
-            item.changeOpen(false);
-            item.animation();
-          }
-        });
-        nextTick(() => {
-          parent.changeVal(currentName.value);
-          animation();
-        });
-      } else {
-        parent.changeValAry(props.name);
-        open();
-      }
-    };
-    const changeOpen = (bol) => {
-      proxyData.openExpanded = bol;
-    };
-    const expanded = computed(() => {
-      if (parent) {
-        return parent.isExpanded(props.name);
+    g2.openExpanded || (() => {
+      const e3 = document.getElementsByClassName("collapse-wrapper")[0];
+      e3 && (e3.style.willChange = "auto");
+    })();
+  }, w2 = () => {
+    g2.openExpanded = !g2.openExpanded, h2();
+  }, T2 = () => {
+    w2(), u2.props.icon && (g2.iconStyle.transform = "rotate(" + u2.props.rotate + "deg)");
+  }, b2 = t(() => c2.name), E2 = t(() => u2 ? u2.isExpanded(c2.name) : null);
+  s(E2, (e2, o2) => {
+    e2 && (g2.openExpanded = true);
+  }), s(() => {
+    var _a, _b;
+    return (_b = (_a = r2 == null ? void 0 : r2.slots) == null ? void 0 : _a.default) == null ? void 0 : _b.call(_a);
+  }, () => {
+    setTimeout(() => {
+      h2();
+    }, 300);
+  }), i(() => {
+    const { name: e2 } = c2, o2 = u2 && u2.props.active;
+    a(() => {
+      if (typeof o2 == "number" || typeof o2 == "string")
+        e2 == o2 && T2();
+      else if (Object.values(o2) instanceof Array) {
+        Object.values(o2).filter((o3) => o3 == e2).length > 0 && T2();
       }
-      return null;
     });
-    watch(expanded, (value, oldValue) => {
-      if (value) {
-        proxyData.openExpanded = true;
-      }
-    });
-    watch(() => {
-      var _a, _b;
-      return (_b = (_a = ctx == null ? void 0 : ctx.slots) == null ? void 0 : _a.default) == null ? void 0 : _b.call(_a);
-    }, () => {
-      setTimeout(() => {
-        animation();
-      }, 300);
-    });
-    onMounted(() => {
-      const { name } = props;
-      const active = parent && parent.props.active;
-      nextTick(() => {
-        if (typeof active == "number" || typeof active == "string") {
-          if (name == active) {
-            defaultOpen();
-          }
-        } else if (Object.values(active) instanceof Array) {
-          const f = Object.values(active).filter((item) => item == name);
-          if (f.length > 0) {
-            defaultOpen();
-          }
-        }
-      });
-    });
-    const emptyContent = computed(() => {
-      let ele = contentRef.value;
-      let _class = "";
-      if (!(ele == null ? void 0 : ele.innerText)) {
-        _class = "empty";
-      }
-      return _class;
-    });
-    return __spreadProps(__spreadValues(__spreadValues(__spreadValues({
-      classes,
-      emptyContent
-    }, toRefs(proxyData)), toRefs(parent.props)), toRefs(titleIconStyle)), {
-      wrapperRef,
-      contentRef,
-      open,
-      toggleOpen,
-      changeOpen,
-      animation
-    });
-  }
-});
-const _hoisted_1 = { class: "collapse-title" };
-const _hoisted_2 = { class: "collapse-title-value" };
-const _hoisted_3 = ["innerHTML"];
-const _hoisted_4 = {
-  key: 0,
-  class: "subTitle"
-};
-const _hoisted_5 = ["innerHTML"];
-const _hoisted_6 = {
-  key: 0,
-  class: "collapse-extraWrapper"
-};
-const _hoisted_7 = { class: "collapse-extraRender" };
-const _hoisted_8 = {
-  class: "collapse-wrapper",
-  ref: "wrapperRef"
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_icon = resolveComponent("nut-icon");
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes)
-  }, [
-    createElementVNode("view", {
-      class: normalizeClass(["collapse-item", { "item-expanded": _ctx.openExpanded }, { "nut-collapse-item-disabled": _ctx.disabled }]),
-      onClick: _cache[0] || (_cache[0] = (...args) => _ctx.toggleOpen && _ctx.toggleOpen(...args))
-    }, [
-      createElementVNode("view", _hoisted_1, [
-        createElementVNode("view", null, [
-          createElementVNode("view", _hoisted_2, [
-            _ctx.titleIcon ? (openBlock(), createBlock(_component_nut_icon, {
-              key: 0,
-              name: _ctx.titleIcon,
-              size: _ctx.titleIconSize,
-              color: _ctx.titleIconColor,
-              class: normalizeClass([_ctx.titleIconPosition == "left" ? "titleIconLeft" : "titleIconRight"])
-            }, null, 8, ["name", "size", "color", "class"])) : createCommentVNode("", true),
-            _ctx.$slots.mTitle ? renderSlot(_ctx.$slots, "mTitle", { key: 1 }) : (openBlock(), createElementBlock("view", {
-              key: 2,
-              innerHTML: _ctx.title,
-              class: "collapse-icon-title"
-            }, null, 8, _hoisted_3))
-          ])
-        ])
-      ]),
-      _ctx.$slots.sTitle ? (openBlock(), createElementBlock("view", _hoisted_4, [
-        renderSlot(_ctx.$slots, "sTitle")
-      ])) : (openBlock(), createElementBlock("view", {
-        key: 1,
-        innerHTML: _ctx.subTitle,
-        class: "subTitle"
-      }, null, 8, _hoisted_5)),
-      _ctx.icon ? (openBlock(), createBlock(_component_nut_icon, {
-        key: 2,
-        name: _ctx.icon,
-        size: _ctx.iconSize,
-        color: _ctx.iconColor,
-        class: normalizeClass(["collapse-icon", { "col-expanded": _ctx.openExpanded }, { "collapse-icon-disabled": _ctx.disabled }]),
-        style: normalizeStyle(_ctx.iconStyle)
-      }, null, 8, ["name", "size", "color", "class", "style"])) : createCommentVNode("", true)
-    ], 2),
-    _ctx.$slots.extraRender ? (openBlock(), createElementBlock("view", _hoisted_6, [
-      createElementVNode("div", _hoisted_7, [
-        renderSlot(_ctx.$slots, "extraRender")
-      ])
-    ])) : createCommentVNode("", true),
-    createElementVNode("view", _hoisted_8, [
-      createElementVNode("view", {
-        class: normalizeClass(["collapse-content", _ctx.emptyContent]),
-        ref: "contentRef"
-      }, [
-        renderSlot(_ctx.$slots, "default")
-      ], 2)
-    ], 512)
-  ], 2);
-}
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+  });
+  return __spreadProps(__spreadValues(__spreadValues(__spreadValues({ classes: m2, emptyContent: t(() => {
+    var _a;
+    let e2 = "";
+    return ((_a = v2.value) == null ? void 0 : _a.innerText) || (e2 = "empty"), e2;
+  }) }, p(g2)), p(u2.props)), p(y2)), { wrapperRef: x2, contentRef: v2, open: w2, toggleOpen: () => {
+    u2.props.accordion ? (u2.children.forEach((e2, o2) => {
+      b2.value == e2.name ? e2.changeOpen(!e2.openExpanded) : (e2.changeOpen(false), e2.animation());
+    }), a(() => {
+      u2.changeVal(b2.value), h2();
+    })) : (u2.changeValAry(c2.name), w2());
+  }, changeOpen: (e2) => {
+    g2.openExpanded = e2;
+  }, animation: h2 });
+} }), b = { class: "collapse-title" }, E = { class: "collapse-title-value" }, S = ["innerHTML"], C = { key: 0, class: "subTitle" }, z = ["innerHTML"], O = { key: 0, class: "collapse-extraWrapper" }, R = { class: "collapse-extraRender" }, $ = { class: "collapse-wrapper", ref: "wrapperRef" };
+var k = h(T, [["render", function(e2, o2, t2, n2, l2, s2) {
+  const i2 = c("nut-icon");
+  return r(), d("view", { class: u(e2.classes) }, [m("view", { class: u(["collapse-item", { "item-expanded": e2.openExpanded }, { "nut-collapse-item-disabled": e2.disabled }]), onClick: o2[0] || (o2[0] = (...o3) => e2.toggleOpen && e2.toggleOpen(...o3)) }, [m("view", b, [m("view", null, [m("view", E, [e2.titleIcon ? (r(), f(i2, { key: 0, name: e2.titleIcon, size: e2.titleIconSize, color: e2.titleIconColor, class: u([e2.titleIconPosition == "left" ? "titleIconLeft" : "titleIconRight"]) }, null, 8, ["name", "size", "color", "class"])) : g("", true), e2.$slots.mTitle ? y(e2.$slots, "mTitle", { key: 1 }) : (r(), d("view", { key: 2, innerHTML: e2.title, class: "collapse-icon-title" }, null, 8, S))])])]), e2.$slots.sTitle ? (r(), d("view", C, [y(e2.$slots, "sTitle")])) : (r(), d("view", { key: 1, innerHTML: e2.subTitle, class: "subTitle" }, null, 8, z)), e2.icon ? (r(), f(i2, { key: 2, name: e2.icon, size: e2.iconSize, color: e2.iconColor, class: u(["collapse-icon", { "col-expanded": e2.openExpanded }, { "collapse-icon-disabled": e2.disabled }]), style: x(e2.iconStyle) }, null, 8, ["name", "size", "color", "class", "style"])) : g("", true)], 2), e2.$slots.extraRender ? (r(), d("view", O, [m("div", R, [y(e2.$slots, "extraRender")])])) : g("", true), m("view", $, [m("view", { class: u(["collapse-content", e2.emptyContent]), ref: "contentRef" }, [y(e2.$slots, "default")], 2)], 512)], 2);
+}]]);
+export { k as default };