winbox-ui-next
Version:
We Design Vue 2.0: A Vue.js 3 UI Library
42 lines (41 loc) • 1.28 kB
JavaScript
import { defineComponent, openBlock, createBlock, Transition, withCtx, renderSlot } from "vue";
import _export_sfc from "../_virtual/plugin-vue_export-helper";
const _sfc_main = defineComponent({
name: "ExpandTransition",
props: {
expanded: Boolean
},
emits: ["end"],
setup(props, { emit }) {
return {
onBeforeEnter(el) {
el.style.height = props.expanded ? "0" : `${el.scrollHeight}px`;
},
onEnter(el) {
el.style.height = props.expanded ? `${el.scrollHeight}px` : "0";
},
onAfterEnter(el) {
el.style.height = props.expanded ? "" : "0";
emit("end");
},
onBeforeLeave(el) {
el.style.display = "none";
}
};
}
});
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return openBlock(), createBlock(Transition, {
onBeforeEnter: _ctx.onBeforeEnter,
onEnter: _ctx.onEnter,
onAfterEnter: _ctx.onAfterEnter,
onBeforeLeave: _ctx.onBeforeLeave
}, {
default: withCtx(() => [
renderSlot(_ctx.$slots, "default")
]),
_: 3
}, 8, ["onBeforeEnter", "onEnter", "onAfterEnter", "onBeforeLeave"]);
}
var ExpandTransition = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
export { ExpandTransition as default };