@wfrog/vc-ui 1.13.1 → 1.13.2

package/dist/es/components/explorer-table/explorer-table.mjs

@@ -1,10 +1,12 @@
 import './index.css'
-import { ElTable, ElLoadingDirective } from 'element-plus/es';
+import { ElTable, ElText, ElIcon } from 'element-plus/es';
 import 'element-plus/es/components/base/style/css';
-import 'element-plus/es/components/loading/style/css';
 import 'element-plus/es/components/table/style/css';
-import { defineComponent, h, useCssVars, useCssModule, useTemplateRef, computed, ref, watch, withDirectives, createElementBlock, openBlock, normalizeClass, unref, createVNode, mergeProps, createSlots, withCtx, createBlock, createCommentVNode, renderSlot, withModifiers, isRef, Fragment, renderList, createTextVNode, toDisplayString, resolveDynamicComponent } from 'vue';
-import { promiseTimeout } from '@vueuse/core';
+import 'element-plus/es/components/text/style/css';
+import 'element-plus/es/components/icon/style/css';
+import { defineComponent, h, useCssVars, useCssModule, useTemplateRef, computed, ref, watch, createBlock, openBlock, normalizeClass, unref, createSlots, withCtx, createCommentVNode, createElementBlock, renderSlot, withModifiers, isRef, createVNode, Fragment, renderList, mergeProps, createTextVNode, toDisplayString, resolveDynamicComponent, createElementVNode } from 'vue';
+import { Loading } from '@element-plus/icons-vue';
+import { useIntersectionObserver, promiseTimeout } from '@vueuse/core';
 import { ElTableColumn, ElRadio, ElCheckbox } from 'element-plus';
 import { i as injectExplorerPanelState } from '../explorer-panel/explorer-panel2.mjs';
 import { _ as _export_sfc } from '../../chunk/pcqpp-6-.mjs';
@@ -20,30 +22,52 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     multipleCheckedKey: { default: "checked" },
     index: { type: Boolean },
     highlightCurrent: { type: Boolean, default: false },
-    empty: { type: Boolean, default: true },
+    empty: { type: Boolean, default: false },
     emptyText: { default: "没有数据" },
-    pending: { type: Boolean },
+    noMoreText: { default: "没有更多了" },
     loading: { type: Boolean, default: false },
-    loadingText: { default: "数据加载中..." },
+    loadingText: { default: "数据加载中" },
     size: {},
     columnRender: { type: Function, default: (column, row) => h("span", row[column.prop]) },
     columnConfig: {},
     columnFilter: { type: Function, default: (column) => column.visible !== false },
     rowClassName: {},
     startIndex: { default: 0 },
-    rowKey: { type: [String, Function], default: "id" }
+    rowKey: { type: [String, Function], default: "id" },
+    scrollLoad: { type: Boolean, default: false },
+    scrollLoadDisabled: { type: Boolean, default: false },
+    scrollLoadRootMargin: { default: "0px" },
+    scrollLoadThreshold: { default: 0 }
   },
-  emits: ["columnEvent", "singleSelectionChange", "multipleSelectionChange", "selectionChange", "selectAll"],
+  emits: ["columnEvent", "singleSelectionChange", "multipleSelectionChange", "selectionChange", "selectAll", "loadMore"],
   setup(__props, { expose: __expose, emit: __emit }) {
     useCssVars((_ctx) => ({
-      "v36843294": `${_ctx.empty ? "flex" : "none"}`
+      "v674feb49": `${_ctx.empty ? "flex" : "none"}`
     }));
     const props = __props;
     const emits = __emit;
     const state = injectExplorerPanelState();
     const $style = useCssModule();
     const tableRef = useTemplateRef("tableRef");
+    const sentinelRef = useTemplateRef("sentinelRef");
     const columns = computed(() => state.columnConfig.value.filter(props.columnFilter));
+    const scrollLoadEnabled = computed(
+      () => props.scrollLoad && props.data.length > 0 && !props.loading && !props.scrollLoadDisabled
+    );
+    const scrollRoot = computed(() => tableRef.value?.scrollBarRef?.wrapRef ?? null);
+    useIntersectionObserver(
+      sentinelRef,
+      ([{ isIntersecting }]) => {
+        if (isIntersecting && scrollLoadEnabled.value) {
+          emits("loadMore");
+        }
+      },
+      {
+        root: scrollRoot,
+        rootMargin: props.scrollLoadRootMargin,
+        threshold: props.scrollLoadThreshold
+      }
+    );
     const selectedValue = ref();
     const selectedValues = computed(() => new Set(props.data.filter((item) => item[props.multipleCheckedKey]).map(getRowValue)));
     const isSingleSelection = computed(() => props.customSelection === "radio");
@@ -145,147 +169,186 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       tableRef
     });
     return (_ctx, _cache) => {
+      const _component_el_icon = ElIcon;
+      const _component_ElText = ElText;
       const _component_ElTable = ElTable;
-      const _directive_loading = ElLoadingDirective;
-      return withDirectives((openBlock(), createElementBlock("div", {
-        class: normalizeClass(unref($style)["explorer-table"])
-      }, [
-        createVNode(_component_ElTable, mergeProps({
-          ref_key: "tableRef",
-          ref: tableRef,
-          data: __props.data,
-          stripe: "",
-          class: unref($style).table,
-          size: __props.size
-        }, _ctx.$attrs, {
-          "scrollbar-always-on": "",
-          "highlight-current-row": __props.highlightCurrent,
-          border: "",
-          "allow-drag-last-column": true,
-          "row-key": __props.rowKey,
-          "row-class-name": myRowClassName,
-          onHeaderDragend
-        }), createSlots({
-          empty: withCtx(() => [
-            renderSlot(_ctx.$slots, "empty", {}, () => [
-              !__props.loading && !__props.pending ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(__props.emptyText), 1)) : (openBlock(), createElementBlock("div", _hoisted_2))
-            ])
-          ]),
-          default: withCtx(() => [
-            __props.selection ? (openBlock(), createBlock(unref(ElTableColumn), {
-              key: 0,
-              type: "selection",
-              width: __props.size === "large" ? 50 : 40,
-              align: "center"
-            }, null, 8, ["width"])) : createCommentVNode("", true),
-            __props.customSelection ? (openBlock(), createBlock(unref(ElTableColumn), {
-              key: 1,
-              width: __props.size === "large" ? 50 : 40,
-              align: "center",
-              fixed: "left",
-              "class-name": unref($style).selection
-            }, createSlots({
-              default: withCtx(({ row }) => [
-                unref(isSingleSelection) ? (openBlock(), createBlock(unref(ElRadio), {
-                  key: 0,
-                  modelValue: unref(selectedValue),
-                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(selectedValue) ? selectedValue.value = $event : null),
-                  value: getRowValue(row),
-                  class: normalizeClass(unref($style).radio),
-                  onClick: withModifiers(($event) => handleRadioClick(row), ["stop"])
-                }, null, 8, ["modelValue", "value", "class", "onClick"])) : createCommentVNode("", true),
-                unref(isMultipleSelection) ? (openBlock(), createBlock(unref(ElCheckbox), {
-                  key: 1,
-                  modelValue: row[__props.multipleCheckedKey],
-                  "onUpdate:modelValue": ($event) => row[__props.multipleCheckedKey] = $event,
-                  class: normalizeClass(unref($style).checkbox),
-                  onClick: withModifiers(($event) => handleCheckboxClick(row), ["stop"])
-                }, null, 8, ["modelValue", "onUpdate:modelValue", "class", "onClick"])) : createCommentVNode("", true)
+      return openBlock(), createBlock(_component_ElTable, {
+        ref_key: "tableRef",
+        ref: tableRef,
+        data: __props.empty ? [] : __props.data,
+        stripe: "",
+        class: normalizeClass(unref($style).table),
+        size: __props.size,
+        "scrollbar-always-on": "",
+        "highlight-current-row": __props.highlightCurrent,
+        border: "",
+        "allow-drag-last-column": true,
+        "row-key": __props.rowKey,
+        "row-class-name": myRowClassName,
+        onHeaderDragend
+      }, createSlots({
+        empty: withCtx(() => [
+          renderSlot(_ctx.$slots, "empty", {}, () => [
+            __props.empty ? (openBlock(), createElementBlock("div", _hoisted_1, [
+              createVNode(_component_ElText, { type: "info" }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(__props.emptyText), 1)
+                ]),
+                _: 1
+              })
+            ])) : (openBlock(), createElementBlock("div", _hoisted_2))
+          ])
+        ]),
+        default: withCtx(() => [
+          __props.selection ? (openBlock(), createBlock(unref(ElTableColumn), {
+            key: 0,
+            type: "selection",
+            width: __props.size === "large" ? 50 : 40,
+            align: "center"
+          }, null, 8, ["width"])) : createCommentVNode("", true),
+          __props.customSelection ? (openBlock(), createBlock(unref(ElTableColumn), {
+            key: 1,
+            width: __props.size === "large" ? 50 : 40,
+            align: "center",
+            fixed: "left",
+            "class-name": unref($style).selection
+          }, createSlots({
+            default: withCtx(({ row }) => [
+              unref(isSingleSelection) ? (openBlock(), createBlock(unref(ElRadio), {
+                key: 0,
+                modelValue: unref(selectedValue),
+                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(selectedValue) ? selectedValue.value = $event : null),
+                value: getRowValue(row),
+                class: normalizeClass(unref($style).radio),
+                onClick: withModifiers(($event) => handleRadioClick(row), ["stop"])
+              }, null, 8, ["modelValue", "value", "class", "onClick"])) : createCommentVNode("", true),
+              unref(isMultipleSelection) ? (openBlock(), createBlock(unref(ElCheckbox), {
+                key: 1,
+                modelValue: row[__props.multipleCheckedKey],
+                "onUpdate:modelValue": ($event) => row[__props.multipleCheckedKey] = $event,
+                class: normalizeClass(unref($style).checkbox),
+                onClick: withModifiers(($event) => handleCheckboxClick(row), ["stop"])
+              }, null, 8, ["modelValue", "onUpdate:modelValue", "class", "onClick"])) : createCommentVNode("", true)
+            ]),
+            _: 2
+          }, [
+            unref(isMultipleSelection) ? {
+              name: "header",
+              fn: withCtx(() => [
+                createVNode(unref(ElCheckbox), {
+                  modelValue: unref(isSelectedAll),
+                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(isSelectedAll) ? isSelectedAll.value = $event : null),
+                  indeterminate: unref(indeterminate),
+                  class: normalizeClass(unref($style).checkbox)
+                }, null, 8, ["modelValue", "indeterminate", "class"])
               ]),
-              _: 2
-            }, [
-              unref(isMultipleSelection) ? {
-                name: "header",
-                fn: withCtx(() => [
-                  createVNode(unref(ElCheckbox), {
-                    modelValue: unref(isSelectedAll),
-                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(isSelectedAll) ? isSelectedAll.value = $event : null),
-                    indeterminate: unref(indeterminate),
-                    class: normalizeClass(unref($style).checkbox)
-                  }, null, 8, ["modelValue", "indeterminate", "class"])
+              key: "0"
+            } : void 0
+          ]), 1032, ["width", "class-name"])) : createCommentVNode("", true),
+          unref(columns).length ? (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(unref(columns), (item) => {
+            return openBlock(), createBlock(unref(ElTableColumn), mergeProps({
+              key: item.prop
+            }, { ref_for: true }, item, {
+              type: columnType(item)
+            }), createSlots({ _: 2 }, [
+              item.prop.startsWith("expand") ? {
+                name: "default",
+                fn: withCtx(({ row, $index }) => [
+                  renderSlot(_ctx.$slots, item.prop, {
+                    row,
+                    index: $index
+                  })
                 ]),
                 key: "0"
-              } : void 0
-            ]), 1032, ["width", "class-name"])) : createCommentVNode("", true),
-            unref(columns).length ? (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(unref(columns), (item) => {
-              return openBlock(), createBlock(unref(ElTableColumn), mergeProps({
-                key: item.prop
-              }, { ref_for: true }, item, {
-                type: columnType(item)
-              }), createSlots({ _: 2 }, [
-                item.prop.startsWith("expand") ? {
-                  name: "default",
-                  fn: withCtx(({ row, $index }) => [
-                    renderSlot(_ctx.$slots, item.prop, {
-                      row,
-                      index: $index
-                    })
-                  ]),
-                  key: "0"
-                } : item.prop === "index" ? {
-                  name: "default",
-                  fn: withCtx(({ $index }) => [
-                    createTextVNode(toDisplayString(__props.startIndex + $index + 1), 1)
+              } : item.prop === "index" ? {
+                name: "default",
+                fn: withCtx(({ $index }) => [
+                  createTextVNode(toDisplayString(__props.startIndex + $index + 1), 1)
+                ]),
+                key: "1"
+              } : item.prop === "operation" ? {
+                name: "default",
+                fn: withCtx(({ row, $index }) => [
+                  renderSlot(_ctx.$slots, "operation", {
+                    row,
+                    index: $index
+                  })
+                ]),
+                key: "2"
+              } : {
+                name: "default",
+                fn: withCtx(({ row, $index }) => [
+                  (openBlock(), createBlock(resolveDynamicComponent(__props.columnRender(item, row, emits, $index))))
+                ]),
+                key: "3"
+              }
+            ]), 1040, ["type"]);
+          }), 128)) : createCommentVNode("", true),
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 2
+      }, [
+        _ctx.$slots.append || unref(scrollLoadEnabled) || __props.loading && __props.scrollLoad || __props.scrollLoadDisabled && __props.scrollLoad ? {
+          name: "append",
+          fn: withCtx(() => [
+            _ctx.$slots.append ? renderSlot(_ctx.$slots, "append", { key: 0 }) : createCommentVNode("", true),
+            unref(scrollLoadEnabled) ? (openBlock(), createElementBlock("div", {
+              key: 1,
+              ref_key: "sentinelRef",
+              ref: sentinelRef,
+              class: normalizeClass(unref($style).sentinel)
+            }, null, 2)) : createCommentVNode("", true),
+            __props.loading && __props.scrollLoad ? renderSlot(_ctx.$slots, "loading", { key: 2 }, () => [
+              createElementVNode("div", {
+                class: normalizeClass(unref($style)["status-text"])
+              }, [
+                createVNode(_component_el_icon, { class: "is-loading" }, {
+                  default: withCtx(() => [
+                    createVNode(unref(Loading))
                   ]),
-                  key: "1"
-                } : item.prop === "operation" ? {
-                  name: "default",
-                  fn: withCtx(({ row, $index }) => [
-                    renderSlot(_ctx.$slots, "operation", {
-                      row,
-                      index: $index
-                    })
+                  _: 1
+                }),
+                createVNode(_component_ElText, { type: "info" }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(__props.loadingText), 1)
                   ]),
-                  key: "2"
-                } : {
-                  name: "default",
-                  fn: withCtx(({ row, $index }) => [
-                    (openBlock(), createBlock(resolveDynamicComponent(__props.columnRender(item, row, emits, $index))))
+                  _: 1
+                })
+              ], 2)
+            ]) : __props.scrollLoadDisabled && __props.scrollLoad ? renderSlot(_ctx.$slots, "no-more", { key: 3 }, () => [
+              createElementVNode("div", {
+                class: normalizeClass(unref($style)["status-text"])
+              }, [
+                createVNode(_component_ElText, { type: "info" }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(__props.noMoreText), 1)
                   ]),
-                  key: "3"
-                }
-              ]), 1040, ["type"]);
-            }), 128)) : createCommentVNode("", true),
-            renderSlot(_ctx.$slots, "default")
+                  _: 1
+                })
+              ], 2)
+            ]) : createCommentVNode("", true)
           ]),
-          _: 2
-        }, [
-          _ctx.$slots.append ? {
-            name: "append",
-            fn: withCtx(() => [
-              renderSlot(_ctx.$slots, "append")
-            ]),
-            key: "0"
-          } : void 0
-        ]), 1040, ["data", "class", "size", "highlight-current-row", "row-key"])
-      ], 2)), [
-        [_directive_loading, __props.loading]
-      ]);
+          key: "0"
+        } : void 0
+      ]), 1032, ["data", "class", "size", "highlight-current-row", "row-key"]);
     };
   }
 });
 
-/* unplugin-vue-components disabled */const table = "_table_1dvo4_7";
-const selection = "_selection_1dvo4_27";
-const radio = "_radio_1dvo4_32";
-const checkbox = "_checkbox_1dvo4_39";
+/* unplugin-vue-components disabled */const table = "_table_1bdji_7";
+const selection = "_selection_1bdji_27";
+const radio = "_radio_1bdji_32";
+const checkbox = "_checkbox_1bdji_39";
+const sentinel = "_sentinel_1bdji_55";
 const style0 = {
-	"explorer-table": "_explorer-table_1dvo4_1",
+	"explorer-table": "_explorer-table_1bdji_1",
 	table: table,
 	selection: selection,
 	radio: radio,
 	checkbox: checkbox,
-	"selected-row": "_selected-row_1dvo4_43"
+	"selected-row": "_selected-row_1bdji_43",
+	"status-text": "_status-text_1bdji_47",
+	sentinel: sentinel
 };
 
 const cssModules = {

package/dist/es/components/explorer-table/explorer-table.vue.d.ts

@@ -12,6 +12,8 @@ declare function __VLS_template(): {
         }): any;
         default?(_: {}): any;
         append?(_: {}): any;
+        loading?(_: {}): any;
+        'no-more'?(_: {}): any;
         empty?(_: {}): any;
     };
     refs: {
@@ -1485,8 +1487,9 @@ declare function __VLS_template(): {
             nativeScrollbar: boolean;
             preserveExpandedContent: boolean;
         }> | null;
+        sentinelRef: HTMLDivElement;
     };
-    rootEl: HTMLDivElement;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<IExplorerTableProps, {
@@ -2965,12 +2968,14 @@ declare const __VLS_component: import('vue').DefineComponent<IExplorerTableProps
         preserveExpandedContent: boolean;
     }> | null>>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    loadMore: () => any;
     columnEvent: (column: IColumnConfig, row: Record<string, any>, value: Record<string, any>) => any;
     singleSelectionChange: (row: Record<string, any>, value: string | number) => any;
     multipleSelectionChange: (row: Record<string, any>, values: (string | number)[]) => any;
     selectionChange: (rows: Record<string, any>[]) => any;
     selectAll: (checked: boolean, values: (string | number)[]) => any;
 }, string, import('vue').PublicProps, Readonly<IExplorerTableProps> & Readonly<{
+    onLoadMore?: (() => any) | undefined;
     onColumnEvent?: ((column: IColumnConfig, row: Record<string, any>, value: Record<string, any>) => any) | undefined;
     onSingleSelectionChange?: ((row: Record<string, any>, value: string | number) => any) | undefined;
     onMultipleSelectionChange?: ((row: Record<string, any>, values: (string | number)[]) => any) | undefined;
@@ -2978,11 +2983,16 @@ declare const __VLS_component: import('vue').DefineComponent<IExplorerTableProps
     onSelectAll?: ((checked: boolean, values: (string | number)[]) => any) | undefined;
 }>, {
     loading: boolean;
+    scrollLoad: boolean;
+    scrollLoadDisabled: boolean;
+    scrollLoadRootMargin: string;
+    scrollLoadThreshold: number;
     loadingText: string;
+    noMoreText: string;
+    empty: boolean;
     emptyText: string;
     highlightCurrent: boolean;
     rowKey: string | ((row: any) => string);
-    empty: boolean;
     multipleCheckedKey: string;
     columnRender: (column: IColumnConfig, row: Record<string, any>, emits: IExplorerTableEmits, index: number) => VNode;
     columnFilter: (column: IColumnConfig) => boolean;
@@ -4458,7 +4468,8 @@ declare const __VLS_component: import('vue').DefineComponent<IExplorerTableProps
         nativeScrollbar: boolean;
         preserveExpandedContent: boolean;
     }> | null;
-}, HTMLDivElement>;
+    sentinelRef: HTMLDivElement;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/es/components/explorer-table/index.css

@@ -1,41 +1,51 @@
 /* source: src/components/explorer-table/explorer-table.vue */
-._explorer-table_1dvo4_1 {
+._explorer-table_1bdji_1 {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
 }
-div._table_1dvo4_7 {
+div._table_1bdji_7 {
   flex-grow: 1;
   height: 100px;
   --el-table-header-bg-color: var(--el-color-info-light-9);
   --el-table-row-hover-bg-color: var(--vc-highlight-bg-color, var(--el-fill-color-light));
 }
-div._table_1dvo4_7 .el-scrollbar__view {
+div._table_1bdji_7 .el-scrollbar__view {
   min-height: 100%;
   height: 100px;
 }
-div._table_1dvo4_7 .el-table__header-wrapper .el-table__cell:hover {
+div._table_1bdji_7 .el-table__header-wrapper .el-table__cell:hover {
   border-right-color: var(--el-color-primary-light-5) !important;
 }
-div._table_1dvo4_7 .el-table__column-resize-proxy {
+div._table_1bdji_7 .el-table__column-resize-proxy {
   border-color: var(--el-color-primary);
 }
-div._table_1dvo4_7 .el-table__empty-block {
-  display: var(--v36843294);
+div._table_1bdji_7 .el-table__empty-block {
+  display: var(--v674feb49);
 }
-._selection_1dvo4_27 .cell {
+._selection_1bdji_27 .cell {
   display: flex;
   align-items: center;
 }
-._radio_1dvo4_32 {
+._radio_1bdji_32 {
   height: unset;
 }
-._radio_1dvo4_32 .el-radio__label {
+._radio_1bdji_32 .el-radio__label {
   display: none;
 }
-._checkbox_1dvo4_39 {
-  height: unset;
+._checkbox_1bdji_39 {
+  height: unset !important;
 }
-._selected-row_1dvo4_43 td.el-table__cell {
+._selected-row_1bdji_43 td.el-table__cell {
   background-color: var(--vc-highlight-bg-color, var(--el-fill-color-light)) !important;
+}
+._status-text_1bdji_47 {
+  padding: 12px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  column-gap: 4px;
+}
+._sentinel_1bdji_55 {
+  height: 0;
 }

package/dist/es/components/icon-picker/components/collections.vue.d.ts

@@ -14,6 +14,16 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
             readonly flex?: boolean | undefined;
             readonly fillHeight?: boolean | undefined;
             readonly viewMargin?: string | undefined;
+            readonly scrollLoad?: boolean | undefined;
+            readonly scrollLoadDisabled?: boolean | undefined;
+            readonly scrollLoadRootMargin?: string | undefined;
+            readonly scrollLoadThreshold?: number | undefined;
+            readonly loading?: boolean | undefined;
+            readonly loadingText?: string | undefined;
+            readonly noMoreText?: string | undefined;
+            readonly empty?: boolean | undefined;
+            readonly emptyText?: string | undefined;
+            readonly onLoadMore?: (() => any) | undefined;
         } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
         $attrs: {
             [x: string]: unknown;
@@ -216,6 +226,7 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
                     default?: (props: {}) => any;
                 };
             }) | null;
+            sentinelRef: HTMLDivElement;
         };
         $slots: Readonly<{
             [name: string]: globalThis.Slot | undefined;
@@ -223,9 +234,11 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
         $root: ComponentPublicInstance | null;
         $parent: ComponentPublicInstance | null;
         $host: Element | null;
-        $emit: (event: string, ...args: any[]) => void;
+        $emit: (event: "loadMore") => void;
         $el: any;
-        $options: import('vue').ComponentOptionsBase<Readonly<import('../../scrollbar/scrollbar').IScrollbarProps> & Readonly<{}>, {
+        $options: import('vue').ComponentOptionsBase<Readonly<import('../../scrollbar/scrollbar').IScrollbarProps> & Readonly<{
+            onLoadMore?: (() => any) | undefined;
+        }>, {
             scrollbarRef: Readonly<globalThis.ShallowRef<({
                 $: import('vue').ComponentInternalInstance;
                 $data: {};
@@ -421,10 +434,21 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
                     default?: (props: {}) => any;
                 };
             }) | null>>;
-        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+            loadMore: () => any;
+        }, string, {
+            loading: boolean;
             flex: boolean;
             fillHeight: boolean;
             viewMargin: string;
+            scrollLoad: boolean;
+            scrollLoadDisabled: boolean;
+            scrollLoadRootMargin: string;
+            scrollLoadThreshold: number;
+            loadingText: string;
+            noMoreText: string;
+            empty: boolean;
+            emptyText: string;
         }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -446,10 +470,21 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
         $nextTick: typeof import('vue').nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
     } & Readonly<{
+        loading: boolean;
         flex: boolean;
         fillHeight: boolean;
         viewMargin: string;
-    }> & Omit<Readonly<import('../../scrollbar/scrollbar').IScrollbarProps> & Readonly<{}>, ("flex" | "fillHeight" | "viewMargin") | "scrollbarRef"> & import('vue').ShallowUnwrapRef<{
+        scrollLoad: boolean;
+        scrollLoadDisabled: boolean;
+        scrollLoadRootMargin: string;
+        scrollLoadThreshold: number;
+        loadingText: string;
+        noMoreText: string;
+        empty: boolean;
+        emptyText: string;
+    }> & Omit<Readonly<import('../../scrollbar/scrollbar').IScrollbarProps> & Readonly<{
+        onLoadMore?: (() => any) | undefined;
+    }>, ("loading" | "flex" | "fillHeight" | "viewMargin" | "scrollLoad" | "scrollLoadDisabled" | "scrollLoadRootMargin" | "scrollLoadThreshold" | "loadingText" | "noMoreText" | "empty" | "emptyText") | "scrollbarRef"> & import('vue').ShallowUnwrapRef<{
         scrollbarRef: Readonly<globalThis.ShallowRef<({
             $: import('vue').ComponentInternalInstance;
             $data: {};
@@ -648,6 +683,9 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
     }> & {} & import('vue').ComponentCustomProperties & {} & {
         $slots: {
             default?(_: {}): any;
+            empty?(_: {}): any;
+            loading?(_: {}): any;
+            'no-more'?(_: {}): any;
         };
     }) | null;
 }, HTMLDivElement>;