nuxt-ui-tools 0.1.0

package/dist/runtime/table/components/actions/TableRowScopeProvider.d.vue.ts

@@ -0,0 +1,17 @@
+import { type TableInjectedRowActionScope } from '../../composables/use-table-row-actions.js';
+type __VLS_Props = {
+    scope: TableInjectedRowActionScope;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/actions/TableRowScopeProvider.vue

@@ -0,0 +1,14 @@
+<script setup>
+import { computed } from "vue";
+import {
+  provideTableRowActionScope
+} from "../../composables/use-table-row-actions";
+const props = defineProps({
+  scope: { type: Object, required: true }
+});
+provideTableRowActionScope(computed(() => props.scope));
+</script>
+
+<template>
+  <slot />
+</template>

package/dist/runtime/table/components/actions/TableRowScopeProvider.vue.d.ts

@@ -0,0 +1,17 @@
+import { type TableInjectedRowActionScope } from '../../composables/use-table-row-actions.js';
+type __VLS_Props = {
+    scope: TableInjectedRowActionScope;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListAddFilter.d.vue.ts

@@ -0,0 +1,27 @@
+import type { DataListAddFilterUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    size?: DataListControlSize;
+    ui?: DataListAddFilterUi;
+};
+declare var __VLS_11: {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    openState: boolean;
+    triggerProps: {
+        type: string;
+        'aria-expanded': boolean;
+    };
+};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListAddFilter.vue

@@ -0,0 +1,39 @@
+<script setup>
+import { computed } from "vue";
+import { useDataListUi } from "../../composables/use-data-list-ui";
+import { useTableInternals } from "../../composables/use-table-internals";
+import { getFilterLabelText } from "../../utils";
+import DynamicFilterPicker from "../filters/shared/DynamicFilterPicker.vue";
+const internals = useTableInternals();
+const props = defineProps({
+  size: { type: String, required: false },
+  ui: { type: Object, required: false }
+});
+const dataListUi = useDataListUi();
+const definitions = computed(() => internals.filterPresentation.dormantDynamicDefinitions.value);
+const resolvedSize = computed(
+  () => props.size ?? dataListUi.ui.value.addFilter?.size ?? dataListUi.controlSize.value
+);
+const resolvedUi = computed(() => ({
+  ...dataListUi.ui.value.addFilter?.ui,
+  ...props.ui
+}));
+function getLabel(definition) {
+  return getFilterLabelText({ label: definition.label });
+}
+</script>
+
+<template>
+  <DynamicFilterPicker
+    v-if="definitions.length"
+    :definitions="definitions"
+    :get-label="getLabel"
+    :size="resolvedSize"
+    :ui="resolvedUi"
+    @select="internals.filterPresentation.activateDynamicFilter({ key: $event })"
+  >
+    <template v-if="$slots.trigger" #trigger="scope">
+      <slot name="trigger" v-bind="scope" />
+    </template>
+  </DynamicFilterPicker>
+</template>

package/dist/runtime/table/components/data-list/DataListAddFilter.vue.d.ts

@@ -0,0 +1,27 @@
+import type { DataListAddFilterUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    size?: DataListControlSize;
+    ui?: DataListAddFilterUi;
+};
+declare var __VLS_11: {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    openState: boolean;
+    triggerProps: {
+        type: string;
+        'aria-expanded': boolean;
+    };
+};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListClearFilters.d.vue.ts

@@ -0,0 +1,25 @@
+import type { DataListClearFiltersUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    label?: string;
+    size?: DataListControlSize;
+    ui?: DataListClearFiltersUi;
+};
+declare var __VLS_1: {
+    clear: () => void;
+    triggerProps: {
+        type: string;
+        onClick: () => void;
+    };
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListClearFilters.vue

@@ -0,0 +1,38 @@
+<script setup>
+import UButton from "@nuxt/ui/components/Button.vue";
+import { computed } from "vue";
+import { useDataListUi } from "../../composables/use-data-list-ui";
+import { useTableInternals } from "../../composables/use-table-internals";
+const props = defineProps({
+  label: { type: String, required: false },
+  size: { type: String, required: false },
+  ui: { type: Object, required: false }
+});
+const internals = useTableInternals();
+const dataListUi = useDataListUi();
+const resolvedSize = computed(
+  () => props.size ?? dataListUi.ui.value.clearFilters?.size ?? dataListUi.controlSize.value
+);
+const resolvedUi = computed(() => ({
+  ...dataListUi.ui.value.clearFilters?.ui,
+  ...props.ui
+}));
+</script>
+
+<template>
+  <slot
+    v-if="internals.filters.hasActiveUiFilters.value"
+    :clear="internals.filters.clearAllFilters"
+    :trigger-props="{ type: 'button', onClick: internals.filters.clearAllFilters }"
+  >
+    <UButton
+      color="neutral"
+      variant="ghost"
+      :size="resolvedSize"
+      :label="label"
+      :icon="label ? void 0 : 'i-lucide-x'"
+      :ui="resolvedUi"
+      @click="internals.filters.clearAllFilters()"
+    />
+  </slot>
+</template>

package/dist/runtime/table/components/data-list/DataListClearFilters.vue.d.ts

@@ -0,0 +1,25 @@
+import type { DataListClearFiltersUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    label?: string;
+    size?: DataListControlSize;
+    ui?: DataListClearFiltersUi;
+};
+declare var __VLS_1: {
+    clear: () => void;
+    triggerProps: {
+        type: string;
+        onClick: () => void;
+    };
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListColumnPanel.d.vue.ts

@@ -0,0 +1,27 @@
+import type { DataListColumnPanelUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    size?: DataListControlSize;
+    ui?: DataListColumnPanelUi;
+};
+declare var __VLS_9: {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    openState: boolean;
+    triggerProps: {
+        type: "button";
+        "aria-expanded": boolean;
+    };
+};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_9) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListColumnPanel.vue

@@ -0,0 +1,17 @@
+<script setup>
+import { useTableInternals } from "../../composables/use-table-internals";
+import ColumnPanel from "../drawers/ColumnPanel.vue";
+defineProps({
+  size: { type: String, required: false },
+  ui: { type: Object, required: false }
+});
+const internals = useTableInternals();
+</script>
+
+<template>
+  <ColumnPanel v-if="internals.controls.tableLayout.value === 'table'" :size="size" :ui="ui">
+    <template v-if="$slots.trigger" #trigger="scope">
+      <slot name="trigger" v-bind="scope" />
+    </template>
+  </ColumnPanel>
+</template>

package/dist/runtime/table/components/data-list/DataListColumnPanel.vue.d.ts

@@ -0,0 +1,27 @@
+import type { DataListColumnPanelUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    size?: DataListControlSize;
+    ui?: DataListColumnPanelUi;
+};
+declare var __VLS_9: {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    openState: boolean;
+    triggerProps: {
+        type: "button";
+        "aria-expanded": boolean;
+    };
+};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_9) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListContent.d.vue.ts

@@ -0,0 +1,72 @@
+import type { DataListContentFit, DataListContentUi } from '../../types/index.js';
+type __VLS_Props = {
+    fit?: DataListContentFit;
+    height?: string | number;
+    transition?: boolean;
+    ui?: DataListContentUi;
+};
+declare function refresh(): void;
+declare var __VLS_1: {}, __VLS_4: "loading" | "initial-loading", __VLS_5: {
+    layout: "table" | "grid";
+}, __VLS_7: {
+    error: {};
+    retry: typeof refresh;
+}, __VLS_9: {
+    layout: "table" | "grid";
+    refresh: typeof refresh;
+}, __VLS_11: {
+    layout: "table" | "grid";
+    rows: object[];
+    loading: boolean;
+    empty: boolean;
+    error: unknown;
+}, __VLS_19: {
+    rows: object[];
+}, __VLS_28: {}, __VLS_30: {
+    layout: string;
+    refresh: typeof refresh;
+}, __VLS_32: {
+    rows: object[];
+}, __VLS_41: {}, __VLS_43: {
+    layout: string;
+    refresh: typeof refresh;
+}, __VLS_45: {}, __VLS_47: {};
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_4>]?: (props: typeof __VLS_5) => any;
+} & {
+    before?: (props: typeof __VLS_1) => any;
+} & {
+    error?: (props: typeof __VLS_7) => any;
+} & {
+    empty?: (props: typeof __VLS_9) => any;
+} & {
+    content?: (props: typeof __VLS_11) => any;
+} & {
+    table?: (props: typeof __VLS_19) => any;
+} & {
+    'empty-table'?: (props: typeof __VLS_28) => any;
+} & {
+    empty?: (props: typeof __VLS_30) => any;
+} & {
+    grid?: (props: typeof __VLS_32) => any;
+} & {
+    'empty-grid'?: (props: typeof __VLS_41) => any;
+} & {
+    empty?: (props: typeof __VLS_43) => any;
+} & {
+    refreshing?: (props: typeof __VLS_45) => any;
+} & {
+    after?: (props: typeof __VLS_47) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    transition: boolean;
+    fit: DataListContentFit;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListContent.vue

@@ -0,0 +1,167 @@
+<script setup>
+import { computed, nextTick, ref, watch } from "vue";
+import { useUiToolsLocale } from "#ui-tools/i18n";
+import { useDataListUi } from "../../composables/use-data-list-ui";
+import { provideDataListViewport } from "../../composables/use-data-list-viewport";
+import { useTableInternals } from "../../composables/use-table-internals";
+import { mergeDataListUiClass } from "../../utils";
+import DataListGrid from "./DataListGrid.vue";
+import DataListTable from "./DataListTable.vue";
+const props = defineProps({
+  fit: { type: String, required: false, default: "content" },
+  height: { type: [String, Number], required: false },
+  transition: { type: Boolean, required: false, default: true },
+  ui: { type: Object, required: false }
+});
+const internals = useTableInternals();
+const dataListUi = useDataListUi();
+const { t } = useUiToolsLocale();
+const viewport = ref(null);
+provideDataListViewport(viewport);
+const rows = computed(() => internals.queryContent.data.value.rows);
+const loading = computed(
+  () => internals.queryContent.status.value.isBooting || internals.queryContent.status.value.isPending && rows.value.length === 0
+);
+const error = computed(() => rows.value.length ? null : internals.queryContent.error.value);
+const empty = computed(() => !loading.value && !error.value && rows.value.length === 0);
+const refreshing = computed(
+  () => rows.value.length > 0 && (internals.queryContent.status.value.isRefreshing || internals.queryContent.status.value.isRevalidating)
+);
+const normalizedHeight = computed(
+  () => typeof props.height === "number" ? `${props.height}px` : props.height
+);
+const viewportStyle = computed(() => {
+  if (props.fit === "fill") return { minHeight: 0 };
+  if (props.fit === "height" && normalizedHeight.value) return { height: normalizedHeight.value };
+  return void 0;
+});
+const rootUi = computed(() => dataListUi.ui.value.content?.ui);
+const shellClass = computed(
+  () => internals.controls.tableLayout.value === "grid" ? "grid gap-5" : "overflow-hidden rounded-md border border-default bg-default"
+);
+function refresh() {
+  void internals.queryContent.refreshData()();
+}
+watch(
+  () => internals.controls.tableLayout.value,
+  () => {
+    nextTick(() => viewport.value?.scrollTo({ top: 0, left: 0 }));
+  }
+);
+watch(
+  () => internals.pagination.currentPage.value,
+  () => {
+    if (internals.pagination.mode.value !== "offset") return;
+    nextTick(() => viewport.value?.scrollTo({ top: 0, left: 0 }));
+  }
+);
+</script>
+
+<template>
+  <div
+    ref="viewport"
+    data-data-list-viewport
+    :class="
+  mergeDataListUiClass(
+    `relative min-h-0 ${shellClass} ${fit === 'content' ? '' : 'overflow-auto'}`,
+    rootUi?.root,
+    ui?.root
+  )
+"
+    :style="viewportStyle"
+  >
+    <slot name="before" />
+
+    <slot
+      v-if="loading && ($slots['initial-loading'] || $slots.loading)"
+      :name="$slots['initial-loading'] ? 'initial-loading' : 'loading'"
+      :layout="internals.controls.tableLayout.value"
+    />
+    <slot v-else-if="error" name="error" :error="error" :retry="refresh">
+      <div
+        :class="
+  mergeDataListUiClass(
+    'grid min-h-64 place-items-center px-4 py-10 text-center',
+    rootUi?.error,
+    ui?.error
+  )
+"
+      >
+        <div :class="mergeDataListUiClass('grid max-w-sm gap-3', rootUi?.errorBody, ui?.errorBody)">
+          <div
+            :class="
+  mergeDataListUiClass(
+    'font-medium text-highlighted',
+    rootUi?.errorTitle,
+    ui?.errorTitle
+  )
+"
+          >
+            {{ t("table.states.gridError.title") }}
+          </div>
+          <button
+            type="button"
+            :class="
+  mergeDataListUiClass(
+    'mx-auto rounded-md border border-default px-3 py-1.5 text-sm text-default hover:bg-elevated',
+    rootUi?.retry,
+    ui?.retry
+  )
+"
+            @click="refresh"
+          >
+            {{ t("table.states.gridError.action") }}
+          </button>
+        </div>
+      </div>
+    </slot>
+    <slot
+      v-else-if="empty && $slots.empty"
+      name="empty"
+      :layout="internals.controls.tableLayout.value"
+      :refresh="refresh"
+    />
+    <slot
+      v-else
+      name="content"
+      :layout="internals.controls.tableLayout.value"
+      :rows="rows"
+      :loading="loading"
+      :empty="empty"
+      :error="error"
+    >
+      <Transition
+        :name="
+  transition ? internals.controls.tableLayout.value === 'grid' ? 'data-list-slide' : 'data-list-slide-reverse' : void 0
+"
+        mode="out-in"
+      >
+        <slot v-if="internals.controls.tableLayout.value === 'table'" name="table" :rows="rows">
+          <DataListTable>
+            <template #empty>
+              <slot name="empty-table">
+                <slot name="empty" :layout="'table'" :refresh="refresh" />
+              </slot>
+            </template>
+          </DataListTable>
+        </slot>
+        <slot v-else name="grid" :rows="rows">
+          <DataListGrid>
+            <template #empty>
+              <slot name="empty-grid">
+                <slot name="empty" :layout="'grid'" :refresh="refresh" />
+              </slot>
+            </template>
+          </DataListGrid>
+        </slot>
+      </Transition>
+    </slot>
+
+    <slot v-if="refreshing" name="refreshing" />
+    <slot name="after" />
+  </div>
+</template>
+
+<style scoped>
+.data-list-slide-enter-active,.data-list-slide-leave-active,.data-list-slide-reverse-enter-active,.data-list-slide-reverse-leave-active{transition:opacity .18s ease,transform .18s ease}.data-list-slide-enter-from,.data-list-slide-reverse-leave-to{opacity:0;transform:translateY(6px)}.data-list-slide-leave-to,.data-list-slide-reverse-enter-from{opacity:0;transform:translateY(-4px)}@media (prefers-reduced-motion:reduce){.data-list-slide-enter-active,.data-list-slide-leave-active,.data-list-slide-reverse-enter-active,.data-list-slide-reverse-leave-active{transition-duration:.01ms}}
+</style>

package/dist/runtime/table/components/data-list/DataListContent.vue.d.ts

@@ -0,0 +1,72 @@
+import type { DataListContentFit, DataListContentUi } from '../../types/index.js';
+type __VLS_Props = {
+    fit?: DataListContentFit;
+    height?: string | number;
+    transition?: boolean;
+    ui?: DataListContentUi;
+};
+declare function refresh(): void;
+declare var __VLS_1: {}, __VLS_4: "loading" | "initial-loading", __VLS_5: {
+    layout: "table" | "grid";
+}, __VLS_7: {
+    error: {};
+    retry: typeof refresh;
+}, __VLS_9: {
+    layout: "table" | "grid";
+    refresh: typeof refresh;
+}, __VLS_11: {
+    layout: "table" | "grid";
+    rows: object[];
+    loading: boolean;
+    empty: boolean;
+    error: unknown;
+}, __VLS_19: {
+    rows: object[];
+}, __VLS_28: {}, __VLS_30: {
+    layout: string;
+    refresh: typeof refresh;
+}, __VLS_32: {
+    rows: object[];
+}, __VLS_41: {}, __VLS_43: {
+    layout: string;
+    refresh: typeof refresh;
+}, __VLS_45: {}, __VLS_47: {};
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_4>]?: (props: typeof __VLS_5) => any;
+} & {
+    before?: (props: typeof __VLS_1) => any;
+} & {
+    error?: (props: typeof __VLS_7) => any;
+} & {
+    empty?: (props: typeof __VLS_9) => any;
+} & {
+    content?: (props: typeof __VLS_11) => any;
+} & {
+    table?: (props: typeof __VLS_19) => any;
+} & {
+    'empty-table'?: (props: typeof __VLS_28) => any;
+} & {
+    empty?: (props: typeof __VLS_30) => any;
+} & {
+    grid?: (props: typeof __VLS_32) => any;
+} & {
+    'empty-grid'?: (props: typeof __VLS_41) => any;
+} & {
+    empty?: (props: typeof __VLS_43) => any;
+} & {
+    refreshing?: (props: typeof __VLS_45) => any;
+} & {
+    after?: (props: typeof __VLS_47) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    transition: boolean;
+    fit: DataListContentFit;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};