UNPKG

load-more-list

Version:
434 lines (373 loc) 45.7 kB
import { defineComponent, TransitionGroup, Transition, h, camelize, toRefs, ref, onMounted, pushScopeId, popScopeId, resolveComponent, openBlock, createBlock, renderSlot, Fragment, renderList, createCommentVNode, createVNode, toDisplayString, createTextVNode, withScopeId, createStaticVNode } from 'vue'; // Utilities function createCssTransition(name, origin = 'top center 0', mode) { return defineComponent({ name, props: { group: Boolean, hideOnLeave: Boolean, leaveAbsolute: Boolean, mode: { type: String, default: mode }, origin: { type: String, default: origin } }, setup(props, { slots }) { return () => { const tag = props.group ? TransitionGroup : Transition; return h(tag, { name, mode: props.mode, onBeforeEnter(el) { el.style.transformOrigin = props.origin; }, onLeave(el) { if (props.leaveAbsolute) { const { offsetTop, offsetLeft, offsetWidth, offsetHeight } = el; el._transitionInitialStyles = { position: el.style.position, top: el.style.top, left: el.style.left, width: el.style.width, height: el.style.height }; el.style.position = 'absolute'; el.style.top = `${offsetTop}px`; el.style.left = `${offsetLeft}px`; el.style.width = `${offsetWidth}px`; el.style.height = `${offsetHeight}px`; } if (props.hideOnLeave) { el._initialDisplay = el.style.display; el.style.display = 'none'; } }, onAfterLeave(el) { if (props.leaveAbsolute && el != null && el._transitionInitialStyles) { const { position, top, left, width, height } = el._transitionInitialStyles; delete el._transitionInitialStyles; el.style.position = position || ''; el.style.top = top || ''; el.style.left = left || ''; el.style.width = width || ''; el.style.height = height || ''; } if (props.hideOnLeave && el) { el.style.display = el._initialDisplay || ''; } } }, slots.default); }; } }); } function createJavascriptTransition(name, functions, mode = 'in-out') { return defineComponent({ name, props: { mode: { type: String, default: mode } }, setup(props, { slots }) { return () => { return h(Transition, { name, // mode: props.mode, // TODO: vuejs/vue-next#3104 ...functions }, slots.default); }; } }); } // Utilities function ExpandTransitionGenerator (expandedParentClass = '', x = false) { const sizeProperty = x ? 'width' : 'height'; const offsetProperty = camelize(`offset-${sizeProperty}`); return { onBeforeEnter(el) { el._parent = el.parentNode; el._initialStyle = { transition: el.style.transition, overflow: el.style.overflow, [sizeProperty]: el.style[sizeProperty] }; }, onEnter(el) { const initialStyle = el._initialStyle; el.style.setProperty('transition', 'none', 'important'); // Hide overflow to account for collapsed margins in the calculated height el.style.overflow = 'hidden'; const offset = `${el[offsetProperty]}px`; el.style[sizeProperty] = '0'; void el.offsetHeight; // force reflow el.style.transition = initialStyle.transition; if (expandedParentClass && el._parent) { el._parent.classList.add(expandedParentClass); } requestAnimationFrame(() => { el.style[sizeProperty] = offset; }); }, onAfterEnter: resetStyles, onEnterCancelled: resetStyles, onLeave(el) { el._initialStyle = { transition: '', overflow: el.style.overflow, [sizeProperty]: el.style[sizeProperty] }; el.style.overflow = 'hidden'; el.style[sizeProperty] = `${el[offsetProperty]}px`; void el.offsetHeight; // force reflow requestAnimationFrame(() => el.style[sizeProperty] = '0'); }, onAfterLeave, onLeaveCancelled: onAfterLeave }; function onAfterLeave(el) { if (expandedParentClass && el._parent) { el._parent.classList.remove(expandedParentClass); } resetStyles(el); } function resetStyles(el) { const size = el._initialStyle[sizeProperty]; el.style.overflow = el._initialStyle.overflow; if (size != null) el.style[sizeProperty] = size; delete el._initialStyle; } } function styleInject(css, ref) { if ( ref === void 0 ) ref = {}; var insertAt = ref.insertAt; if (!css || typeof document === 'undefined') { return; } var head = document.head || document.getElementsByTagName('head')[0]; var style = document.createElement('style'); style.type = 'text/css'; if (insertAt === 'top') { if (head.firstChild) { head.insertBefore(style, head.firstChild); } else { head.appendChild(style); } } else { head.appendChild(style); } if (style.styleSheet) { style.styleSheet.cssText = css; } else { style.appendChild(document.createTextNode(css)); } } var css_248z$1 = "\n.carousel-transition-enter-from {\n transform: translate(100%, 0);\n}\n.carousel-transition-leave-from, .carousel-transition-leave-to {\n position: absolute;\n top: 0;\n transform: translate(-100%, 0);\n}\n\n.carousel-reverse-transition-enter-from {\n transform: translate(-100%, 0);\n}\n.carousel-reverse-transition-leave-from, .carousel-reverse-transition-leave-to {\n position: absolute;\n top: 0;\n transform: translate(100%, 0);\n}\n\n.dialog-transition-enter-active {\n transition: 225ms cubic-bezier(0, 0, 0.2, 1);\n}\n.dialog-transition-leave-active {\n transition: 125ms cubic-bezier(0.4, 0, 1, 1);\n}\n.dialog-transition-enter-active, .dialog-transition-leave-active {\n transition-property: transform, opacity;\n}\n.dialog-transition-enter-from, .dialog-transition-leave-to {\n transform: scale(0.9);\n opacity: 0;\n}\n.dialog-transition-enter-to, .dialog-transition-leave-from {\n opacity: 1;\n}\n\n.dialog-bottom-transition-enter-from, .dialog-bottom-transition-leave-to {\n transform: translateY(100%);\n}\n\n.dialog-top-transition-enter-from, .dialog-top-transition-leave-to {\n transform: translateY(-100%);\n}\n\n.picker-transition-enter-from, .picker-transition-leave-to,\n.picker-reverse-transition-enter-from,\n.picker-reverse-transition-leave-to {\n opacity: 0;\n}\n.picker-transition-leave-from, .picker-transition-leave-active, .picker-transition-leave-to,\n.picker-reverse-transition-leave-from,\n.picker-reverse-transition-leave-active,\n.picker-reverse-transition-leave-to {\n position: absolute !important;\n}\n\n.picker-transition-enter-from {\n transform: translate(0, 100%);\n}\n.picker-transition-leave-to {\n transform: translate(0, -100%);\n}\n\n.picker-reverse-transition-enter-from {\n transform: translate(0, -100%);\n}\n.picker-reverse-transition-leave-to {\n transform: translate(0, 100%);\n}\n\n.picker-title-transition-enter-to, .picker-title-transition-leave-from {\n transform: translate(0, 0);\n}\n.picker-title-transition-enter-from {\n transform: translate(-100%, 0);\n}\n.picker-title-transition-leave-to {\n opacity: 0;\n transform: translate(100%, 0);\n}\n.picker-title-transition-leave-from, .picker-title-transition-leave-to, .picker-title-transition-leave-active {\n position: absolute !important;\n}\n\n.tab-transition-enter-from {\n transform: translate(100%, 0);\n}\n.tab-transition-leave-from, .tab-transition-leave-active {\n position: absolute;\n top: 0;\n}\n.tab-transition-leave-to {\n position: absolute;\n transform: translate(-100%, 0);\n}\n\n.tab-reverse-transition-enter-from {\n transform: translate(-100%, 0);\n}\n.tab-reverse-transition-leave-from, .tab-reverse-transition-leave-to {\n top: 0;\n position: absolute;\n transform: translate(100%, 0);\n}\n\n.expand-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.expand-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.expand-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.expand-x-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.expand-x-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.expand-x-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.scale-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-transition-enter-from, .scale-transition-leave-from, .scale-transition-leave-to {\n opacity: 0;\n transform: scale(0);\n}\n\n.scale-rotate-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-rotate-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-rotate-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-rotate-transition-enter-from, .scale-rotate-transition-leave, .scale-rotate-transition-leave-to {\n opacity: 0;\n transform: scale(0) rotate(-45deg);\n}\n\n.scale-rotate-reverse-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-rotate-reverse-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-rotate-reverse-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scale-rotate-reverse-transition-enter-from, .scale-rotate-reverse-transition-leave-from, .scale-rotate-reverse-transition-leave-to {\n opacity: 0;\n transform: scale(0) rotate(45deg);\n}\n\n.message-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.message-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.message-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.message-transition-enter-from, .message-transition-leave-to {\n opacity: 0;\n transform: translateY(-15px);\n}\n.message-transition-leave-from, .message-transition-leave-active {\n position: absolute;\n}\n\n.slide-y-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-y-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-y-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-y-transition-enter-from, .slide-y-transition-leave-to {\n opacity: 0;\n transform: translateY(-15px);\n}\n\n.slide-y-reverse-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-y-reverse-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-y-reverse-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-y-reverse-transition-enter-from, .slide-y-reverse-transition-leave-to {\n opacity: 0;\n transform: translateY(15px);\n}\n\n.scroll-y-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-y-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-y-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-y-transition-enter-from, .scroll-y-transition-leave-to {\n opacity: 0;\n}\n.scroll-y-transition-enter-from {\n transform: translateY(-15px);\n}\n.scroll-y-transition-leave-to {\n transform: translateY(15px);\n}\n\n.scroll-y-reverse-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-y-reverse-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-y-reverse-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-y-reverse-transition-enter-from, .scroll-y-reverse-transition-leave-to {\n opacity: 0;\n}\n.scroll-y-reverse-transition-enter-from {\n transform: translateY(15px);\n}\n.scroll-y-reverse-transition-leave-to {\n transform: translateY(-15px);\n}\n\n.scroll-x-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-x-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-x-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-x-transition-enter-from, .scroll-x-transition-leave-to {\n opacity: 0;\n}\n.scroll-x-transition-enter-from {\n transform: translateX(-15px);\n}\n.scroll-x-transition-leave-to {\n transform: translateX(15px);\n}\n\n.scroll-x-reverse-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-x-reverse-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-x-reverse-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.scroll-x-reverse-transition-enter-from, .scroll-x-reverse-transition-leave-to {\n opacity: 0;\n}\n.scroll-x-reverse-transition-enter-from {\n transform: translateX(15px);\n}\n.scroll-x-reverse-transition-leave-to {\n transform: translateX(-15px);\n}\n\n.slide-x-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-x-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-x-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-x-transition-enter-from, .slide-x-transition-leave-to {\n opacity: 0;\n transform: translateX(-15px);\n}\n\n.slide-x-reverse-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-x-reverse-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-x-reverse-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.slide-x-reverse-transition-enter-from, .slide-x-reverse-transition-leave-to {\n opacity: 0;\n transform: translateX(15px);\n}\n\n.fade-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.fade-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.fade-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.fade-transition-enter-from, .fade-transition-leave-to {\n opacity: 0 !important;\n}\n\n.fab-transition-enter-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.fab-transition-leave-active {\n transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.fab-transition-move {\n transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.fab-transition-enter-from, .fab-transition-leave-to {\n transform: scale(0) rotate(-45deg);\n}\n"; styleInject(css_248z$1); createCssTransition('carousel-transition'); createCssTransition('carousel-reverse-transition'); createCssTransition('tab-transition'); createCssTransition('tab-reverse-transition'); createCssTransition('menu-transition'); createCssTransition('fab-transition', 'center center', 'out-in'); // Generic transitions createCssTransition('dialog-bottom-transition'); createCssTransition('dialog-top-transition'); createCssTransition('fade-transition'); const VeilScaleTransition = createCssTransition('scale-transition'); createCssTransition('scroll-x-transition'); createCssTransition('scroll-x-reverse-transition'); createCssTransition('scroll-y-transition'); createCssTransition('scroll-y-reverse-transition'); createCssTransition('slide-x-transition'); createCssTransition('slide-x-reverse-transition'); const VeilSlideYTransition = createCssTransition('slide-y-transition'); createCssTransition('slide-y-reverse-transition'); // Javascript transitions createJavascriptTransition('expand-transition', ExpandTransitionGenerator()); createJavascriptTransition('expand-x-transition', ExpandTransitionGenerator('', true)); var script = /*#__PURE__*/defineComponent({ name: 'LoadMoreList', emits: ['load-more'], components: { VeilSlideYTransition, VeilScaleTransition }, props: { //是否有更多列表项 hasMore: { type: Boolean, default: true }, //加载中 loading: { type: Boolean, default: false }, //加载中 loadOnMounted: { type: Boolean, default: true }, skeletonCount: { type: Number, default: 3 }, bottomThreshold: { type: Number, default: 100 }, noMoreText: String, loadMoreText: String }, data: function () { return { bottom: false }; }, setup(props, { emit }) { let { bottomThreshold, loading, loadOnMounted } = toRefs(props); let bottom = false; let firstLoading = ref(true); const onScroll = e => { let top = e.target.scrollTop; let height = e.target.scrollHeight; let visible = e.target.clientHeight; bottom = height <= top + visible + bottomThreshold.value; if (bottom && !loading.value) { emit('load-more'); firstLoading.value = false; } }; onMounted(() => { if (loadOnMounted.value) { emit('load-more'); } }); const clickLoadMore = () => { emit('load-more'); }; return { onScroll, clickLoadMore, firstLoading }; } }); const _withId = /*#__PURE__*/withScopeId("data-v-8dc713b6"); pushScopeId("data-v-8dc713b6"); const _hoisted_1 = /*#__PURE__*/createStaticVNode("<div class=\"tw-flex tw-animate-pulse tw-h-16 tw-mx-5 tw-my-6\" data-v-8dc713b6><div class=\"tw-bg-gray-200 tw-h-16 tw-w-16 tw-flex-shrink-0 tw-mx-3\" data-v-8dc713b6></div><div class=\"tw-flex-grow tw-justify-between tw-flex tw-flex-col tw-mx-3\" data-v-8dc713b6><div class=\"tw-bg-gray-200 tw-h-1/4\" data-v-8dc713b6></div><div class=\"tw-bg-gray-200 tw-h-1/4\" data-v-8dc713b6></div><div class=\"tw-bg-gray-200 tw-h-1/4\" data-v-8dc713b6></div></div></div>", 1); const _hoisted_2 = { key: 0, class: "tw-cursor-wait tw-p-2 tw-text-lg tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-text-center" }; const _hoisted_3 = /*#__PURE__*/createVNode("div", { class: "tw-animate-spin tw-p-2" }, [/*#__PURE__*/createVNode("svg", { class: "icon", viewBox: "0 0 1024 1024", xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28" }, [/*#__PURE__*/createVNode("path", { fill: "#888", d: "M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3 0.1 19.9-16 36-35.9 36z" })])], -1); const _hoisted_4 = { key: 0, class: "tw-text-sm tw-p-2 tw-text-gray-400 tw-text-center" }; const _hoisted_5 = /*#__PURE__*/createVNode("div", { class: "tw-p-2 tw-animate-pulse" }, [/*#__PURE__*/createVNode("svg", { class: "icon", viewBox: "0 0 1024 1024", xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18" }, [/*#__PURE__*/createVNode("path", { d: "M533.712538 101.851631c13.248955-7.183654 30.638839-1.148579 38.658739 13.420235l73.095947 132.862338c8.060201 14.558738 3.737918 32.351632-9.511037 39.535285s-30.648914 1.148579-38.658739-13.420234l-73.106023-132.862338c-8.009825-14.558738-3.727843-32.351632 9.521113-39.535286z", fill: "#555" }), /*#__PURE__*/createVNode("path", { d: "M700.347117 10.388501c-8.956898-12.090301-27.26363-13.883696-40.673789-4.030101L536.815715 96.350544c-13.410159 9.82337-17.047325 27.727091-8.060201 39.787167s27.273705 13.883696 40.683864 4.030101L692.266766 50.175668c13.410159-9.82337 17.047325-27.727091 8.080351-39.787167zM485.804718 922.148359c-13.248955 7.183654-30.648914 1.148579-38.658739-13.420235l-73.106022-132.862338c-8.009825-14.558738-3.727843-32.351632 9.521112-39.535285s30.648914-1.148579 38.658739 13.420234l73.106023 132.862338c8.009825 14.558738 3.727843 32.351632-9.521113 39.535286z", fill: "#555" }), /*#__PURE__*/createVNode("path", { d: "M319.160063 1013.611489c8.966974 12.090301 27.273705 13.883696 40.683865 4.030101l122.857613-89.982069c13.410159-9.82337 17.047325-27.727091 8.060201-39.787167s-27.273705-13.883696-40.683865-4.0301L327.25049 973.824322c-13.410159 9.82337-17.017099 27.727091-8.090427 39.787167z", fill: "#555" }), /*#__PURE__*/createVNode("path", { d: "M462.470436 928.485692a32.381857 32.381857 0 0 1-4.0301-0.251882A424.168076 424.168076 0 0 1 195.063194 790.112192a418.878569 418.878569 0 0 1-39.404307-507.520629 423.744915 423.744915 0 0 1 174.825759-152.488927 32.240804 32.240804 0 0 1 27.49536 58.325629 359.333834 359.333834 0 0 0-148.247246 129.305774 354.366735 354.366735 0 0 0 33.389382 429.387056A359.756995 359.756995 0 0 0 466.399784 864.255965a32.240804 32.240804 0 0 1-3.969649 64.229727zM660.852133 902.511694a32.240804 32.240804 0 0 1-12.191054-62.103848 358.678943 358.678943 0 0 0 160.408074-129.164721 354.376811 354.376811 0 0 0-31.29373-440.590735 359.36406 359.36406 0 0 0-229.927308-114.777262 32.243826 32.243826 0 0 1 6.297032-64.17935 423.785216 423.785216 0 0 1 271.135085 135.371075 418.868494 418.868494 0 0 1 36.915721 520.719208A423.029572 423.029572 0 0 1 673.033111 900.103709a32.109826 32.109826 0 0 1-12.180978 2.407985z", fill: "#555" })])], -1); popScopeId(); const render = /*#__PURE__*/_withId((_ctx, _cache, $props, $setup, $data, $options) => { const _component_VeilScaleTransition = resolveComponent("VeilScaleTransition"); return openBlock(), createBlock("div", { class: "tw-overflow-y-auto tw-overflow-x-hidden", onScroll: _cache[2] || (_cache[2] = (...args) => _ctx.onScroll && _ctx.onScroll(...args)) }, [renderSlot(_ctx.$slots, "default"), renderSlot(_ctx.$slots, "skeleton", { loading: _ctx.loading }, () => [_ctx.loading ? (openBlock(true), createBlock(Fragment, { key: 0 }, renderList(_ctx.skeletonCount, index => { return renderSlot(_ctx.$slots, "skeleton-item", { key: index }, () => [_hoisted_1]); }), 128)) : createCommentVNode("", true)]), renderSlot(_ctx.$slots, "footer", { hasMore: _ctx.hasMore, clickLoadMore: _ctx.clickLoadMore, loading: _ctx.loading }, () => [renderSlot(_ctx.$slots, "loading", { hasMore: _ctx.hasMore, loading: _ctx.loading }, () => [createVNode(_component_VeilScaleTransition, null, { default: _withId(() => [_ctx.loading ? (openBlock(), createBlock("div", _hoisted_2, [_hoisted_3])) : createCommentVNode("", true)]), _: 1 })]), renderSlot(_ctx.$slots, "no-more", { hasMore: _ctx.hasMore, loading: _ctx.loading }, () => [!_ctx.loading && !_ctx.hasMore ? (openBlock(), createBlock("div", _hoisted_4, toDisplayString(_ctx.noMoreText || '没有更多了'), 1)) : createCommentVNode("", true)]), renderSlot(_ctx.$slots, "load-more", { clickLoadMore: _ctx.clickLoadMore }, () => [!_ctx.loading && _ctx.hasMore ? (openBlock(), createBlock("div", { key: 0, class: "tw-text-sm tw-p-2 tw-cursor-pointer tw-flex tw-justify-center tw-items-center tw-text-gray-400 tw-text-center", onClick: _cache[1] || (_cache[1] = (...args) => _ctx.clickLoadMore && _ctx.clickLoadMore(...args)) }, [createTextVNode(toDisplayString(_ctx.loadMoreText || '加载更多') + " ", 1), _hoisted_5])) : createCommentVNode("", true)]), renderSlot(_ctx.$slots, "footer-append")])], 32); }); var css_248z = "\n/*! tailwindcss v2.2.4 | MIT License | https://tailwindcss.com *//*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n*[data-v-8dc713b6],[data-v-8dc713b6]::after,[data-v-8dc713b6]::before {\n box-sizing: border-box\n}\nhtml[data-v-8dc713b6] {\n -moz-tab-size: 4;\n -o-tab-size: 4;\n tab-size: 4\n}\nhtml[data-v-8dc713b6] {\n line-height: 1.15;\n -webkit-text-size-adjust: 100%\n}\nbody[data-v-8dc713b6] {\n margin: 0\n}\nbody[data-v-8dc713b6] {\n font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji'\n}\nhr[data-v-8dc713b6] {\n height: 0;\n color: inherit\n}\nabbr[title][data-v-8dc713b6] {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted\n}\nb[data-v-8dc713b6], strong[data-v-8dc713b6] {\n font-weight: bolder\n}\ncode[data-v-8dc713b6], kbd[data-v-8dc713b6], pre[data-v-8dc713b6], samp[data-v-8dc713b6] {\n font-family: ui-monospace, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;\n font-size: 1em\n}\nsmall[data-v-8dc713b6] {\n font-size: 80%\n}\nsub[data-v-8dc713b6], sup[data-v-8dc713b6] {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline\n}\nsub[data-v-8dc713b6] {\n bottom: -.25em\n}\nsup[data-v-8dc713b6] {\n top: -.5em\n}\ntable[data-v-8dc713b6] {\n text-indent: 0;\n border-color: inherit\n}\nbutton[data-v-8dc713b6], input[data-v-8dc713b6], optgroup[data-v-8dc713b6], select[data-v-8dc713b6], textarea[data-v-8dc713b6] {\n font-family: inherit;\n font-size: 100%;\n line-height: 1.15;\n margin: 0\n}\nbutton[data-v-8dc713b6], select[data-v-8dc713b6] {\n text-transform: none\n}\n[type=button][data-v-8dc713b6], [type=reset][data-v-8dc713b6], button[data-v-8dc713b6] {\n -webkit-appearance: button\n}\nlegend[data-v-8dc713b6] {\n padding: 0\n}\nprogress[data-v-8dc713b6] {\n vertical-align: baseline\n}\nsummary[data-v-8dc713b6] {\n display: list-item\n}\nblockquote[data-v-8dc713b6], dd[data-v-8dc713b6], dl[data-v-8dc713b6], figure[data-v-8dc713b6], h1[data-v-8dc713b6], h2[data-v-8dc713b6], h3[data-v-8dc713b6], h4[data-v-8dc713b6], h5[data-v-8dc713b6], h6[data-v-8dc713b6], hr[data-v-8dc713b6], p[data-v-8dc713b6], pre[data-v-8dc713b6] {\n margin: 0\n}\nbutton[data-v-8dc713b6] {\n background-color: transparent;\n background-image: none\n}\nfieldset[data-v-8dc713b6] {\n margin: 0;\n padding: 0\n}\nol[data-v-8dc713b6], ul[data-v-8dc713b6] {\n list-style: none;\n margin: 0;\n padding: 0\n}\nhtml[data-v-8dc713b6] {\n font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n line-height: 1.5\n}\nbody[data-v-8dc713b6] {\n font-family: inherit;\n line-height: inherit\n}\n*[data-v-8dc713b6],[data-v-8dc713b6]::after,[data-v-8dc713b6]::before {\n box-sizing: border-box;\n border-width: 0;\n border-style: solid;\n border-color: currentColor\n}\nhr[data-v-8dc713b6] {\n border-top-width: 1px\n}\nimg[data-v-8dc713b6] {\n border-style: solid\n}\ntextarea[data-v-8dc713b6] {\n resize: vertical\n}\ninput[data-v-8dc713b6]::-moz-placeholder, textarea[data-v-8dc713b6]::-moz-placeholder {\n opacity: 1;\n color: #a1a1aa\n}\ninput[data-v-8dc713b6]:-ms-input-placeholder, textarea[data-v-8dc713b6]:-ms-input-placeholder {\n opacity: 1;\n color: #a1a1aa\n}\ninput[data-v-8dc713b6]::placeholder, textarea[data-v-8dc713b6]::placeholder {\n opacity: 1;\n color: #a1a1aa\n}\nbutton[data-v-8dc713b6] {\n cursor: pointer\n}\ntable[data-v-8dc713b6] {\n border-collapse: collapse\n}\nh1[data-v-8dc713b6], h2[data-v-8dc713b6], h3[data-v-8dc713b6], h4[data-v-8dc713b6], h5[data-v-8dc713b6], h6[data-v-8dc713b6] {\n font-size: inherit;\n font-weight: inherit\n}\na[data-v-8dc713b6] {\n color: inherit;\n text-decoration: inherit\n}\nbutton[data-v-8dc713b6], input[data-v-8dc713b6], optgroup[data-v-8dc713b6], select[data-v-8dc713b6], textarea[data-v-8dc713b6] {\n padding: 0;\n line-height: inherit;\n color: inherit\n}\ncode[data-v-8dc713b6], kbd[data-v-8dc713b6], pre[data-v-8dc713b6], samp[data-v-8dc713b6] {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace\n}\naudio[data-v-8dc713b6], canvas[data-v-8dc713b6], embed[data-v-8dc713b6], iframe[data-v-8dc713b6], img[data-v-8dc713b6], object[data-v-8dc713b6], svg[data-v-8dc713b6], video[data-v-8dc713b6] {\n display: block;\n vertical-align: middle\n}\nimg[data-v-8dc713b6], video[data-v-8dc713b6] {\n max-width: 100%;\n height: auto\n}\n*[data-v-8dc713b6],[data-v-8dc713b6]::after,[data-v-8dc713b6]::before {\n --tw-border-opacity: 1;\n border-color: rgba(228, 228, 231, var(--tw-border-opacity))\n}\n.tw-m-2[data-v-8dc713b6] {\n margin: .5rem\n}\n.tw-mx-3[data-v-8dc713b6] {\n margin-left: .75rem;\n margin-right: .75rem\n}\n.tw-mx-5[data-v-8dc713b6] {\n margin-left: 1.25rem;\n margin-right: 1.25rem\n}\n.tw-my-6[data-v-8dc713b6] {\n margin-top: 1.5rem;\n margin-bottom: 1.5rem\n}\n.tw-flex[data-v-8dc713b6] {\n display: flex\n}\n.tw-h-12[data-v-8dc713b6] {\n height: 3rem\n}\n.tw-h-16[data-v-8dc713b6] {\n height: 4rem\n}\n.tw-h-1\\/4[data-v-8dc713b6] {\n height: 25%\n}\n.tw-h-screen[data-v-8dc713b6] {\n height: 100vh\n}\n.tw-w-16[data-v-8dc713b6] {\n width: 4rem\n}\n.tw-flex-shrink-0[data-v-8dc713b6] {\n flex-shrink: 0\n}\n.tw-flex-grow[data-v-8dc713b6] {\n flex-grow: 1\n}\n@-webkit-keyframes tw-spin-8dc713b6 {\nto {\n transform: rotate(360deg)\n}\n}\n@keyframes tw-spin-8dc713b6 {\nto {\n transform: rotate(360deg)\n}\n}\n@-webkit-keyframes tw-ping-8dc713b6 {\n100%, 75% {\n transform: scale(2);\n opacity: 0\n}\n}\n@keyframes tw-ping-8dc713b6 {\n100%, 75% {\n transform: scale(2);\n opacity: 0\n}\n}\n@-webkit-keyframes tw-pulse-8dc713b6 {\n50% {\n opacity: .5\n}\n}\n@keyframes tw-pulse-8dc713b6 {\n50% {\n opacity: .5\n}\n}\n@-webkit-keyframes tw-bounce-8dc713b6 {\n0%, 100% {\n transform: translateY(-25%);\n -webkit-animation-timing-function: cubic-bezier(.8, 0, 1, 1);\n animation-timing-function: cubic-bezier(.8, 0, 1, 1)\n}\n50% {\n transform: none;\n -webkit-animation-timing-function: cubic-bezier(0, 0, .2, 1);\n animation-timing-function: cubic-bezier(0, 0, .2, 1)\n}\n}\n@keyframes tw-bounce-8dc713b6 {\n0%, 100% {\n transform: translateY(-25%);\n -webkit-animation-timing-function: cubic-bezier(.8, 0, 1, 1);\n animation-timing-function: cubic-bezier(.8, 0, 1, 1)\n}\n50% {\n transform: none;\n -webkit-animation-timing-function: cubic-bezier(0, 0, .2, 1);\n animation-timing-function: cubic-bezier(0, 0, .2, 1)\n}\n}\n.tw-animate-spin[data-v-8dc713b6] {\n -webkit-animation: tw-spin-8dc713b6 1s linear infinite;\n animation: tw-spin-8dc713b6 1s linear infinite\n}\n.tw-animate-pulse[data-v-8dc713b6] {\n -webkit-animation: tw-pulse-8dc713b6 2s cubic-bezier(.4, 0, .6, 1) infinite;\n animation: tw-pulse-8dc713b6 2s cubic-bezier(.4, 0, .6, 1) infinite\n}\n.tw-cursor-pointer[data-v-8dc713b6] {\n cursor: pointer\n}\n.tw-cursor-wait[data-v-8dc713b6] {\n cursor: wait\n}\n.tw-flex-col[data-v-8dc713b6] {\n flex-direction: column\n}\n.tw-items-center[data-v-8dc713b6] {\n align-items: center\n}\n.tw-justify-center[data-v-8dc713b6] {\n justify-content: center\n}\n.tw-justify-between[data-v-8dc713b6] {\n justify-content: space-between\n}\n.tw-self-end[data-v-8dc713b6] {\n align-self: flex-end\n}\n.tw-overflow-y-auto[data-v-8dc713b6] {\n overflow-y: auto\n}\n.tw-overflow-x-hidden[data-v-8dc713b6] {\n overflow-x: hidden\n}\n.tw-rounded[data-v-8dc713b6] {\n border-radius: .25rem\n}\n.tw-bg-gray-200[data-v-8dc713b6] {\n --tw-bg-opacity: 1;\n background-color: rgba(228, 228, 231, var(--tw-bg-opacity))\n}\n.tw-bg-purple-100[data-v-8dc713b6] {\n --tw-bg-opacity: 1;\n background-color: rgba(243, 232, 255, var(--tw-bg-opacity))\n}\n.tw-bg-sky-300[data-v-8dc713b6] {\n --tw-bg-opacity: 1;\n background-color: rgba(125, 211, 252, var(--tw-bg-opacity))\n}\n.tw-p-1[data-v-8dc713b6] {\n padding: .25rem\n}\n.tw-p-2[data-v-8dc713b6] {\n padding: .5rem\n}\n.tw-p-4[data-v-8dc713b6] {\n padding: 1rem\n}\n.tw-text-left[data-v-8dc713b6] {\n text-align: left\n}\n.tw-text-center[data-v-8dc713b6] {\n text-align: center\n}\n.tw-text-sm[data-v-8dc713b6] {\n font-size: .875rem;\n line-height: 1.25rem\n}\n.tw-text-lg[data-v-8dc713b6] {\n font-size: 1.125rem;\n line-height: 1.75rem\n}\n.tw-font-light[data-v-8dc713b6] {\n font-weight: 300\n}\n.tw-font-normal[data-v-8dc713b6] {\n font-weight: 400\n}\n.tw-text-gray-400[data-v-8dc713b6] {\n --tw-text-opacity: 1;\n color: rgba(161, 161, 170, var(--tw-text-opacity))\n}\n*[data-v-8dc713b6],[data-v-8dc713b6]::after,[data-v-8dc713b6]::before {\n --tw-shadow: 0 0 #0000\n}\n.tw-shadow-lg[data-v-8dc713b6] {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)\n}\n*[data-v-8dc713b6],[data-v-8dc713b6]::after,[data-v-8dc713b6]::before {\n --tw-ring-inset: var(--tw-empty,); /*!*//*!*/\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgba(59, 130, 246, 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000\n}\n.carousel-transition-enter-from[data-v-8dc713b6] {\n transform: translate(100%, 0)\n}\n.carousel-transition-leave-from[data-v-8dc713b6], .carousel-transition-leave-to[data-v-8dc713b6] {\n position: absolute;\n top: 0;\n transform: translate(-100%, 0)\n}\n.carousel-reverse-transition-enter-from[data-v-8dc713b6] {\n transform: translate(-100%, 0)\n}\n.carousel-reverse-transition-leave-from[data-v-8dc713b6], .carousel-reverse-transition-leave-to[data-v-8dc713b6] {\n position: absolute;\n top: 0;\n transform: translate(100%, 0)\n}\n.dialog-transition-enter-active[data-v-8dc713b6] {\n transition: 225ms cubic-bezier(0, 0, .2, 1)\n}\n.dialog-transition-leave-active[data-v-8dc713b6] {\n transition: 125ms cubic-bezier(.4, 0, 1, 1)\n}\n.dialog-transition-enter-active[data-v-8dc713b6], .dialog-transition-leave-active[data-v-8dc713b6] {\n transition-property: transform, opacity\n}\n.dialog-transition-enter-from[data-v-8dc713b6], .dialog-transition-leave-to[data-v-8dc713b6] {\n transform: scale(.9);\n opacity: 0\n}\n.dialog-transition-enter-to[data-v-8dc713b6], .dialog-transition-leave-from[data-v-8dc713b6] {\n opacity: 1\n}\n.dialog-bottom-transition-enter-from[data-v-8dc713b6], .dialog-bottom-transition-leave-to[data-v-8dc713b6] {\n transform: translateY(100%)\n}\n.dialog-top-transition-enter-from[data-v-8dc713b6], .dialog-top-transition-leave-to[data-v-8dc713b6] {\n transform: translateY(-100%)\n}\n.picker-reverse-transition-enter-from[data-v-8dc713b6], .picker-reverse-transition-leave-to[data-v-8dc713b6], .picker-transition-enter-from[data-v-8dc713b6], .picker-transition-leave-to[data-v-8dc713b6] {\n opacity: 0\n}\n.picker-reverse-transition-leave-active[data-v-8dc713b6], .picker-reverse-transition-leave-from[data-v-8dc713b6], .picker-reverse-transition-leave-to[data-v-8dc713b6], .picker-transition-leave-active[data-v-8dc713b6], .picker-transition-leave-from[data-v-8dc713b6], .picker-transition-leave-to[data-v-8dc713b6] {\n position: absolute !important\n}\n.picker-transition-enter-from[data-v-8dc713b6] {\n transform: translate(0, 100%)\n}\n.picker-transition-leave-to[data-v-8dc713b6] {\n transform: translate(0, -100%)\n}\n.picker-reverse-transition-enter-from[data-v-8dc713b6] {\n transform: translate(0, -100%)\n}\n.picker-reverse-transition-leave-to[data-v-8dc713b6] {\n transform: translate(0, 100%)\n}\n.picker-title-transition-enter-to[data-v-8dc713b6], .picker-title-transition-leave-from[data-v-8dc713b6] {\n transform: translate(0, 0)\n}\n.picker-title-transition-enter-from[data-v-8dc713b6] {\n transform: translate(-100%, 0)\n}\n.picker-title-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: translate(100%, 0)\n}\n.picker-title-transition-leave-active[data-v-8dc713b6], .picker-title-transition-leave-from[data-v-8dc713b6], .picker-title-transition-leave-to[data-v-8dc713b6] {\n position: absolute !important\n}\n.tab-transition-enter-from[data-v-8dc713b6] {\n transform: translate(100%, 0)\n}\n.tab-transition-leave-active[data-v-8dc713b6], .tab-transition-leave-from[data-v-8dc713b6] {\n position: absolute;\n top: 0\n}\n.tab-transition-leave-to[data-v-8dc713b6] {\n position: absolute;\n transform: translate(-100%, 0)\n}\n.tab-reverse-transition-enter-from[data-v-8dc713b6] {\n transform: translate(-100%, 0)\n}\n.tab-reverse-transition-leave-from[data-v-8dc713b6], .tab-reverse-transition-leave-to[data-v-8dc713b6] {\n top: 0;\n position: absolute;\n transform: translate(100%, 0)\n}\n.expand-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.expand-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.expand-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.expand-x-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.expand-x-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.expand-x-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-transition-enter-from[data-v-8dc713b6], .scale-transition-leave-from[data-v-8dc713b6], .scale-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: scale(0)\n}\n.scale-rotate-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-rotate-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-rotate-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-rotate-transition-enter-from[data-v-8dc713b6], .scale-rotate-transition-leave[data-v-8dc713b6], .scale-rotate-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: scale(0) rotate(-45deg)\n}\n.scale-rotate-reverse-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-rotate-reverse-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-rotate-reverse-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scale-rotate-reverse-transition-enter-from[data-v-8dc713b6], .scale-rotate-reverse-transition-leave-from[data-v-8dc713b6], .scale-rotate-reverse-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: scale(0) rotate(45deg)\n}\n.message-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.message-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.message-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.message-transition-enter-from[data-v-8dc713b6], .message-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: translateY(-15px)\n}\n.message-transition-leave-active[data-v-8dc713b6], .message-transition-leave-from[data-v-8dc713b6] {\n position: absolute\n}\n.slide-y-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-y-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-y-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-y-transition-enter-from[data-v-8dc713b6], .slide-y-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: translateY(-15px)\n}\n.slide-y-reverse-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-y-reverse-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-y-reverse-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-y-reverse-transition-enter-from[data-v-8dc713b6], .slide-y-reverse-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: translateY(15px)\n}\n.scroll-y-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-y-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-y-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-y-transition-enter-from[data-v-8dc713b6], .scroll-y-transition-leave-to[data-v-8dc713b6] {\n opacity: 0\n}\n.scroll-y-transition-enter-from[data-v-8dc713b6] {\n transform: translateY(-15px)\n}\n.scroll-y-transition-leave-to[data-v-8dc713b6] {\n transform: translateY(15px)\n}\n.scroll-y-reverse-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-y-reverse-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-y-reverse-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-y-reverse-transition-enter-from[data-v-8dc713b6], .scroll-y-reverse-transition-leave-to[data-v-8dc713b6] {\n opacity: 0\n}\n.scroll-y-reverse-transition-enter-from[data-v-8dc713b6] {\n transform: translateY(15px)\n}\n.scroll-y-reverse-transition-leave-to[data-v-8dc713b6] {\n transform: translateY(-15px)\n}\n.scroll-x-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-x-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-x-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-x-transition-enter-from[data-v-8dc713b6], .scroll-x-transition-leave-to[data-v-8dc713b6] {\n opacity: 0\n}\n.scroll-x-transition-enter-from[data-v-8dc713b6] {\n transform: translateX(-15px)\n}\n.scroll-x-transition-leave-to[data-v-8dc713b6] {\n transform: translateX(15px)\n}\n.scroll-x-reverse-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-x-reverse-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-x-reverse-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.scroll-x-reverse-transition-enter-from[data-v-8dc713b6], .scroll-x-reverse-transition-leave-to[data-v-8dc713b6] {\n opacity: 0\n}\n.scroll-x-reverse-transition-enter-from[data-v-8dc713b6] {\n transform: translateX(15px)\n}\n.scroll-x-reverse-transition-leave-to[data-v-8dc713b6] {\n transform: translateX(-15px)\n}\n.slide-x-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-x-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-x-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-x-transition-enter-from[data-v-8dc713b6], .slide-x-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: translateX(-15px)\n}\n.slide-x-reverse-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-x-reverse-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-x-reverse-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.slide-x-reverse-transition-enter-from[data-v-8dc713b6], .slide-x-reverse-transition-leave-to[data-v-8dc713b6] {\n opacity: 0;\n transform: translateX(15px)\n}\n.fade-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.fade-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.fade-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.fade-transition-enter-from[data-v-8dc713b6], .fade-transition-leave-to[data-v-8dc713b6] {\n opacity: 0 !important\n}\n.fab-transition-enter-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.fab-transition-leave-active[data-v-8dc713b6] {\n transition: .3s cubic-bezier(.4, 0, .2, 1)\n}\n.fab-transition-move[data-v-8dc713b6] {\n transition: transform .5s cubic-bezier(.4, 0, .2, 1)\n}\n.fab-transition-enter-from[data-v-8dc713b6], .fab-transition-leave-to[data-v-8dc713b6] {\n transform: scale(0) rotate(-45deg)\n}\n\n"; styleInject(css_248z); script.render = render; script.__scopeId = "data-v-8dc713b6"; /* eslint-disable import/prefer-default-export */ var components = /*#__PURE__*/Object.freeze({ __proto__: null, LoadMoreList: script }); // Import vue components const install = function installLoadMoreList(app) { Object.entries(components).forEach(([componentName, component]) => { app.component(componentName, component); }); }; // Create module definition for Vue.use() export default install; export { script as LoadMoreList };