nuxt-ui-tools 1.2.0 → 1.4.0

package/dist/runtime/dashboard/composables/use-dashboard-format.js

@@ -1,12 +1,55 @@
-import { computed } from "vue";
+import { computed, markRaw } from "vue";
 import { useUiToolsLocale } from "../../i18n/use-locale.js";
-import { resolveDashboardFormats } from "../utils/charts.js";
+import { isNumber } from "../../shared/utils/predicate.js";
+import { currentDashboardLocale } from "../utils/environment.js";
+import {
+  formatDashboardMonth,
+  resolveDashboardFormats,
+  resolveDashboardNumberFormat
+} from "../utils/format.js";
 export function useDashboardFormat() {
-  const { code } = useUiToolsLocale();
+  const { code, t } = currentDashboardLocale() ?? useUiToolsLocale();
   const formats = computed(() => resolveDashboardFormats(code.value));
-  return {
-    delta: computed(() => formats.value.delta),
-    number: computed(() => formats.value.number),
-    percent: computed(() => formats.value.percent)
-  };
+  const plurals = computed(() => new Intl.PluralRules(code.value));
+  function points(value) {
+    const form = plurals.value.select(Math.abs(value)) === "one" ? "pointsOne" : "pointsOther";
+    return t(`dashboard.format.${form}`, { value: formats.value.signed(value) });
+  }
+  function resolve(format, fallback = "number") {
+    const current = format ?? fallback;
+    if (typeof current === "function") return current;
+    if (typeof current === "string") return current === "points" ? points : formats.value[current];
+    return resolveDashboardNumberFormat(code.value, current);
+  }
+  return markRaw({
+    /** `12600` → "12.6K". */
+    compact: orMissing((value) => formats.value.compact(value)),
+    /** An amount in a currency, rounded to units unless `options` say otherwise. */
+    currency: (value, currency, options) => isPresent(value) ? resolveDashboardNumberFormat(code.value, { currency, ...options })(value) : DASHBOARD_MISSING_VALUE,
+    /** One decimal at most. */
+    decimal: orMissing((value) => formats.value.decimal(value)),
+    /** Signed percent change: `12.4` → "+12.4%". */
+    delta: orMissing((value) => formats.value.delta(value)),
+    /** Grouped, no decimals. */
+    integer: orMissing((value) => formats.value.integer(value)),
+    /** Month name, capitalized: `3` (1–12) or a date → "Mar" (`'long'`: "March"). */
+    month: (value, width = "short") => formatDashboardMonth(code.value, value, width),
+    /** Grouped, one decimal at most, compact from 10,000. */
+    number: orMissing((value) => formats.value.number(value)),
+    /** A share out of 100: `57` → "57%". */
+    percent: orMissing((value) => formats.value.percent(value)),
+    points: orMissing(points),
+    /** A share out of 1: `0.57` → "57%". */
+    ratio: orMissing((value) => formats.value.ratio(value)),
+    resolve,
+    /** Signed number: `3` → "+3". */
+    signed: orMissing((value) => formats.value.signed(value))
+  });
+}
+export const DASHBOARD_MISSING_VALUE = "\u2014";
+function isPresent(value) {
+  return isNumber(value) && Number.isFinite(value);
+}
+function orMissing(format) {
+  return (value) => isPresent(value) ? format(value) : DASHBOARD_MISSING_VALUE;
 }

package/dist/runtime/dashboard/composables/use-dashboard-options.d.ts

@@ -1,8 +1,15 @@
 import type { QueryKey } from '@tanstack/vue-query';
-import type { DashboardOptionsHandle, DashboardRuntimeParam } from '../types/index.js';
-/** Option handle of one option-backed param: static items, or a remote source. */
+import type { DashboardRuntimeFilter } from '../types/index.js';
+import type { DashboardRuntimeOptionList } from '../types/runtime.js';
+import type { DashboardLocale } from '../utils/environment.js';
+/**
+ * Option list of one filter: static items (fixed, or read from data), or a remote source. Items of
+ * values without labels of their own (`enum`, `boolean`) take their text from `format`, and
+ * booleans and comparison periods fall back to localized labels.
+ */
 export declare function useDashboardOptions(params: {
-    definition: DashboardRuntimeParam;
+    definition: DashboardRuntimeFilter;
     queryKey: QueryKey;
+    locale: DashboardLocale;
     value: () => unknown;
-}): DashboardOptionsHandle;
+}): DashboardRuntimeOptionList;

package/dist/runtime/dashboard/composables/use-dashboard-options.js

@@ -1,7 +1,9 @@
-import { computed, markRaw, shallowRef } from "vue";
-import { useUiToolsLocale } from "../../i18n/use-locale.js";
-import { resolveDashboardOptionValues } from "../utils/options.js";
+import { computed, shallowRef } from "vue";
+import { matchesDashboardSearch } from "../utils/options.js";
 import { useDashboardRemoteOptions } from "./use-dashboard-remote-options.js";
+const noMenuBindings = computed(() => ({}));
+const noError = computed(() => void 0);
+const off = computed(() => false);
 export function useDashboardOptions(params) {
   const { definition } = params;
   if (definition.remote)
@@ -10,54 +12,38 @@ export function useDashboardOptions(params) {
       queryKey: params.queryKey,
       value: params.value
     });
-  const items = definition.items ?? [];
-  if (definition.kind !== "comparison") return createStaticOptionsHandle(() => items, params.value);
-  const { t } = useUiToolsLocale();
-  const localized = computed(
-    () => items.map((item) => ({ ...item, label: t(`dashboard.compare.${String(item.value)}`) }))
-  );
-  return createStaticOptionsHandle(() => localized.value, params.value);
-}
-function createStaticOptionsHandle(items, value) {
+  const { t } = params.locale;
   const search = shallowRef("");
   const open = shallowRef(false);
-  const byValue = computed(() => new Map(items().map((item) => [String(item.value), item])));
-  const selected = computed(
-    () => resolveDashboardOptionValues(value()).flatMap((entry) => byValue.value.get(entry) ?? [])
+  function label(item) {
+    if (definition.kind === "comparison") return t(`dashboard.compare.${String(item.value)}`);
+    if (definition.format && definition.kind !== "options") return definition.format(item.value);
+    if (definition.kind === "boolean")
+      return t(item.value === true ? "dashboard.filters.yes" : "dashboard.filters.no");
+    return item.label;
+  }
+  const all = computed(
+    () => (definition.items?.() ?? []).map((item) => ({ ...item, label: label(item) }))
   );
-  const menu = computed(() => ({
-    items: [...items()],
-    labelKey: "label",
-    valueKey: "value"
-  }));
-  return markRaw({
-    error: void 0,
-    hasMore: false,
-    get items() {
-      return items();
-    },
-    loading: false,
-    loadingMore: false,
+  const known = computed(() => new Map(all.value.map((item) => [String(item.value), item])));
+  const order = computed(() => new Map(all.value.map((item, index) => [String(item.value), index])));
+  const items = computed(
+    () => search.value ? all.value.filter((item) => matchesDashboardSearch(item.label, search.value)) : all.value
+  );
+  return {
+    error: noError,
+    hasMore: off,
+    items,
+    known,
     loadMore() {
     },
-    get menu() {
-      return menu.value;
-    },
-    get open() {
-      return open.value;
-    },
-    set open(next) {
-      open.value = next;
-    },
+    loading: off,
+    loadingMore: off,
+    menu: noMenuBindings,
+    open,
+    order,
     refresh: () => Promise.resolve(),
-    get search() {
-      return search.value;
-    },
-    set search(next) {
-      search.value = next;
-    },
-    get selected() {
-      return selected.value;
-    }
-  });
+    resolving: off,
+    search
+  };
 }

package/dist/runtime/dashboard/composables/use-dashboard-remote-options.d.ts

@@ -1,12 +1,15 @@
 import type { QueryKey } from '@tanstack/vue-query';
-import type { DashboardOptionsHandle, DashboardRemoteOptionsConfig } from '../types/index.js';
+import type { DashboardRemoteOptionsConfig } from '../types/index.js';
+import type { DashboardRuntimeOptionList } from '../types/runtime.js';
 /**
- * Remote option handle. Nothing loads until the picker opens or a search term is typed; pages are
- * cached per search term by TanStack Query, and selected values missing from the loaded pages are
- * hydrated through `resolveSelected` so URL-restored ids render their labels.
+ * Remote option list. Nothing loads until the picker opens or a search term is typed; pages are
+ * cached per search term by TanStack Query (the previous term's options stay on screen while the
+ * next one loads), and selected values missing from the loaded pages are hydrated through
+ * `resolveSelected` so URL-restored ids render their labels. Sources may return query definitions
+ * or promises.
  */
 export declare function useDashboardRemoteOptions(params: {
     config: DashboardRemoteOptionsConfig;
     queryKey: QueryKey;
     value: () => unknown;
-}): DashboardOptionsHandle;
+}): DashboardRuntimeOptionList;

package/dist/runtime/dashboard/composables/use-dashboard-remote-options.js

@@ -1,30 +1,39 @@
 import { useInfiniteQuery, useQuery } from "@tanstack/vue-query";
 import { refDebounced } from "@vueuse/core";
-import { computed, markRaw, shallowRef } from "vue";
+import { computed, shallowRef } from "vue";
 import {
   REMOTE_OPTIONS_FIRST_PAGE,
   resolveRemoteOptionsNextPage
 } from "../../shared/utils/remote-options.js";
 import { DASHBOARD_REMOTE_OPTIONS_DEFAULTS } from "../constants/query.js";
 import { mergeDashboardOptions, resolveDashboardOptionValues } from "../utils/options.js";
+import { runDashboardRemoteResult } from "../utils/remote.js";
 export function useDashboardRemoteOptions(params) {
   const { config } = params;
   const queryKey = config.queryKey ?? params.queryKey;
-  const pageSize = config.pagination?.size ?? DASHBOARD_REMOTE_OPTIONS_DEFAULTS.pageSize;
+  const pageSize = Math.max(
+    1,
+    config.pagination?.size ?? DASHBOARD_REMOTE_OPTIONS_DEFAULTS.pageSize
+  );
   const minLength = config.search?.minLength ?? 0;
   const open = shallowRef(false);
-  const searchInput = shallowRef("");
-  const search = refDebounced(
-    searchInput,
+  const search = shallowRef("");
+  const term = refDebounced(
+    computed(() => search.value.trim()),
     config.search?.debounce ?? DASHBOARD_REMOTE_OPTIONS_DEFAULTS.searchDebounce
   );
   const pages = useInfiniteQuery(
     computed(() => ({
-      enabled: (open.value || searchInput.value !== "") && (search.value.length === 0 || search.value.length >= minLength),
+      enabled: (open.value || search.value !== "") && (term.value.length === 0 || term.value.length >= minLength),
       getNextPageParam: (lastPage, allPages) => resolveRemoteOptionsNextPage(lastPage, allPages.length),
       initialPageParam: REMOTE_OPTIONS_FIRST_PAGE,
-      queryFn: ({ pageParam }) => config.load({ page: { ...pageParam, size: pageSize }, search: search.value }),
-      queryKey: [...queryKey, "options", search.value],
+      // Keeps the previous term's options on screen while the next term loads.
+      placeholderData: (previous) => previous,
+      queryFn: (context) => runDashboardRemoteResult(
+        config.load({ page: { ...context.pageParam, size: pageSize }, search: term.value }),
+        context
+      ),
+      queryKey: [...queryKey, "options", term.value],
       staleTime: DASHBOARD_REMOTE_OPTIONS_DEFAULTS.staleTime
     }))
   );
@@ -34,84 +43,64 @@ export function useDashboardRemoteOptions(params) {
   const loadedByValue = computed(
     () => new Map(loaded.value.map((option) => [option.value, option]))
   );
-  const selectedValues = computed(() => resolveDashboardOptionValues(params.value()));
   const missing = computed(
-    () => selectedValues.value.filter((value) => !loadedByValue.value.has(value))
+    () => resolveDashboardOptionValues(params.value()).filter((value) => !loadedByValue.value.has(value))
   );
   const hydration = useQuery(
     computed(() => ({
       enabled: Boolean(config.resolveSelected) && missing.value.length > 0,
-      queryFn: () => config.resolveSelected?.({ values: missing.value }) ?? Promise.resolve([]),
+      queryFn: (context) => config.resolveSelected ? runDashboardRemoteResult(config.resolveSelected({ values: missing.value }), context) : Promise.resolve([]),
       queryKey: [...queryKey, "selected", missing.value],
+      // Hydrated labels stay while the next set of missing values resolves.
+      placeholderData: (previous) => previous,
       staleTime: DASHBOARD_REMOTE_OPTIONS_DEFAULTS.selectedStaleTime
     }))
   );
-  const selected = computed(() => {
-    const hydrated = new Map((hydration.data.value ?? []).map((option) => [option.value, option]));
-    return selectedValues.value.map(
-      (value) => loadedByValue.value.get(value) ?? hydrated.get(value) ?? { label: value, value }
-    );
-  });
-  const items = computed(
-    () => mergeDashboardOptions(loaded.value, selected.value)
+  const hydrated = computed(() => hydration.data.value ?? []);
+  const known = computed(
+    () => new Map(
+      mergeDashboardOptions(loaded.value, hydrated.value).map((option) => [
+        String(option.value),
+        option
+      ])
+    )
   );
-  const loading = computed(
-    () => pages.isFetching.value && !pages.isFetchingNextPage.value || hydration.isFetching.value
+  const items = computed(
+    () => term.value ? loaded.value : mergeDashboardOptions(
+      loaded.value,
+      hydrated.value.filter((option) => missing.value.includes(option.value))
+    )
   );
-  function setSearch(next) {
-    searchInput.value = next;
-  }
-  function setOpen(next) {
-    open.value = next;
-  }
-  return markRaw({
-    get error() {
-      return pages.error.value ?? hydration.error.value;
-    },
-    get hasMore() {
-      return pages.hasNextPage.value;
-    },
-    get items() {
-      return items.value;
-    },
-    get loading() {
-      return loading.value;
+  const loading = computed(() => pages.isFetching.value && !pages.isFetchingNextPage.value);
+  const menu = computed(() => ({
+    ignoreFilter: true,
+    loading: loading.value,
+    "onUpdate:open": (next) => {
+      open.value = next;
     },
-    get loadingMore() {
-      return pages.isFetchingNextPage.value;
+    "onUpdate:searchTerm": (next) => {
+      search.value = next;
     },
+    searchTerm: search.value
+  }));
+  return {
+    error: computed(() => pages.error.value ?? hydration.error.value ?? void 0),
+    hasMore: computed(() => pages.hasNextPage.value),
+    items,
+    known,
     loadMore() {
-      if (pages.hasNextPage.value && !pages.isFetchingNextPage.value) void pages.fetchNextPage();
-    },
-    get menu() {
-      return {
-        ignoreFilter: true,
-        items: items.value,
-        labelKey: "label",
-        loading: loading.value,
-        "onUpdate:open": setOpen,
-        "onUpdate:searchTerm": setSearch,
-        searchTerm: searchInput.value,
-        valueKey: "value"
-      };
-    },
-    get open() {
-      return open.value;
-    },
-    set open(next) {
-      setOpen(next);
+      if (!pages.hasNextPage.value || pages.isFetching.value) return;
+      void pages.fetchNextPage();
     },
+    loading,
+    loadingMore: computed(() => pages.isFetchingNextPage.value),
+    menu,
+    open,
+    order: computed(() => null),
     async refresh() {
       await pages.refetch();
     },
-    get search() {
-      return searchInput.value;
-    },
-    set search(next) {
-      setSearch(next);
-    },
-    get selected() {
-      return selected.value;
-    }
-  });
+    resolving: computed(() => hydration.isFetching.value),
+    search
+  };
 }

package/dist/runtime/dashboard/composables/use-dashboard-resource.d.ts

@@ -2,10 +2,16 @@ import type { QueryKey } from '@tanstack/vue-query';
 import type { ComputedRef } from 'vue';
 import type { DashboardResourceState, DashboardStage } from '../types/index.js';
 import type { DashboardRuntimeQueryInput } from '../types/runtime.js';
+import type { DashboardEnvironment } from '../utils/environment.js';
+import type { DashboardReadTracker } from '../utils/tracker.js';
 /**
- * Owns one declared query: exactly one `useQuery`, its widget params, and the deferred activation
+ * Owns one declared query: exactly one `useQuery`, its own filters, and the deferred activation
  * latch. Gating rewrites `enabled` on a stable definition, so hook order never changes, and a gated
- * resource never evaluates its factory (it does not subscribe to params it cannot use yet).
+ * resource never evaluates its factory (it does not subscribe to filters it cannot use yet).
+ *
+ * `requires` runs through the read tracker: while it returns nothing, the resource follows the
+ * resources it read (loading while they load), then settles on its default value once they are
+ * ready without satisfying it.
  */
 export declare function useDashboardResource(params: {
     id: string;
@@ -15,21 +21,26 @@ export declare function useDashboardResource(params: {
     scope: {
         active: ComputedRef<boolean>;
         settled: ComputedRef<boolean>;
+        /** The scope's own availability: a disabled view disables every query it declares. */
+        enabled: ComputedRef<boolean>;
         prefix: string;
         queryKey: QueryKey;
         /** Dashboard auto-refresh interval in milliseconds, `0` when off. */
         refetchInterval: ComputedRef<number>;
     };
+    tracker: DashboardReadTracker;
+    environment: DashboardEnvironment;
 }): {
     activate: () => void;
     active: ComputedRef<boolean>;
     data: ComputedRef<unknown>;
-    error: import("vue").Ref<Error, Error> | import("vue").Ref<null, null>;
+    error: ComputedRef<unknown>;
     id: string;
     refresh: () => Promise<void>;
+    fetching: ComputedRef<boolean>;
     refreshing: ComputedRef<boolean>;
     stage: DashboardStage;
     state: ComputedRef<DashboardResourceState>;
     updatedAt: ComputedRef<number | undefined>;
-    widget: import("./use-dashboard-param-scope.js").DashboardParamScope;
+    filters: import("./use-dashboard-filter-scope.js").DashboardFilterScope;
 };

package/dist/runtime/dashboard/composables/use-dashboard-resource.js

@@ -2,30 +2,49 @@ import { keepPreviousData, useQuery } from "@tanstack/vue-query";
 import { computed, shallowRef } from "vue";
 import { hasProperty, isNullish } from "../../shared/utils/predicate.js";
 import { DASHBOARD_QUERY_DEFAULTS } from "../constants/query.js";
-import { dashboardParamBuilder } from "../utils/builders/dashboard-params.js";
-import { joinDashboardUrlKey } from "../utils/state.js";
-import { useDashboardParamScope } from "./use-dashboard-param-scope.js";
+import { dashboardFilterBuilder } from "../utils/builders/dashboard-filters.js";
+import { resolveDashboardFilters } from "../utils/schema.js";
+import {
+  combineDashboardStates,
+  joinDashboardUrlKey,
+  refreshDashboardSources,
+  resolveDashboardCondition
+} from "../utils/state.js";
+import { useDashboardFilterScope } from "./use-dashboard-filter-scope.js";
 export function useDashboardResource(params) {
   const { input, stage, scope } = params;
   const activated = shallowRef(stage !== "deferred");
-  const widget = useDashboardParamScope({
-    definitions: input.params?.(dashboardParamBuilder) ?? {},
+  const filters = useDashboardFilterScope({
+    definitions: resolveDashboardFilters({ builder: dashboardFilterBuilder, input: input.filters }),
+    environment: params.environment,
+    owner: `query "${params.id}"`,
     prefix: joinDashboardUrlKey(scope.prefix, params.key),
-    queryKey: [...scope.queryKey, params.id, "params"]
+    queryKey: [...scope.queryKey, params.id, "filters"]
   });
   const active = computed(() => scope.active.value && activated.value);
+  const available = computed(
+    () => scope.enabled.value && resolveDashboardCondition(input.enabled)
+  );
   const gate = computed(() => {
-    if (!active.value) return false;
+    if (!active.value || !available.value) return false;
     if (stage === "background" && !scope.settled.value) return false;
-    return input.enabled?.() ?? true;
+    return true;
+  });
+  const requirement = computed(() => {
+    const sources = /* @__PURE__ */ new Set();
+    if (!gate.value || !input.requires) return { sources: [], value: true };
+    const value = params.tracker.run(sources, input.requires);
+    return { sources: [...sources], value };
   });
-  const required = computed(() => gate.value && input.requires ? input.requires() : true);
-  const enabled = computed(() => gate.value && !isNullish(required.value));
+  const enabled = computed(() => gate.value && !isNullish(requirement.value.value));
+  const upstream = computed(
+    () => combineDashboardStates(requirement.value.sources.map((source) => source.state))
+  );
   const query = useQuery(
     computed(() => enabled.value ? resolveDefinition() : idleDefinition(params.id))
   );
   function resolveDefinition() {
-    const definition = input.query({ params: widget.values, required: required.value });
+    const definition = input.query({ filters: filters.values, required: requirement.value.value });
     const interval = scope.refetchInterval.value;
     return {
       placeholderData: input.keepPreviousData === false ? void 0 : keepPreviousData,
@@ -38,14 +57,28 @@ export function useDashboardResource(params) {
     };
   }
   const state = computed(() => {
-    if (!enabled.value) return "idle";
+    if (!available.value) return "disabled";
+    if (!gate.value) return "idle";
+    if (!enabled.value) {
+      if (upstream.value !== "ready") return upstream.value;
+      return input.defaultValue === void 0 ? "idle" : "ready";
+    }
     if (query.isError.value) return "error";
     return query.data.value === void 0 ? "loading" : "ready";
   });
-  const data = computed(
-    () => enabled.value && query.data.value !== void 0 ? query.data.value : input.defaultValue
+  const data = computed(() => {
+    if (!enabled.value || query.data.value === void 0) return input.defaultValue;
+    return input.select ? input.select(query.data.value) : query.data.value;
+  });
+  const error = computed(
+    () => enabled.value ? query.error.value ?? void 0 : requirement.value.sources.find((source) => source.state === "error")?.error
   );
   const refreshing = computed(() => state.value === "ready" && query.isFetching.value);
+  const fetching = computed(() => {
+    if (!available.value) return false;
+    if (enabled.value) return query.isFetching.value;
+    return requirement.value.sources.some((source) => source.fetching ?? source.refreshing);
+  });
   const updatedAt = computed(
     () => state.value === "ready" && query.dataUpdatedAt.value > 0 ? query.dataUpdatedAt.value : void 0
   );
@@ -53,22 +86,24 @@ export function useDashboardResource(params) {
     activated.value = true;
   }
   async function refresh() {
+    if (!available.value) return;
     if (!activated.value) return activate();
-    if (!enabled.value) return;
+    if (!enabled.value) return refreshDashboardSources(requirement.value.sources);
     await query.refetch({ throwOnError: true });
   }
   return {
     activate,
     active,
     data,
-    error: query.error,
+    error,
     id: params.id,
     refresh,
+    fetching,
     refreshing,
     stage,
     state,
     updatedAt,
-    widget
+    filters
   };
 }
 function idleDefinition(id) {

package/dist/runtime/dashboard/composables/use-dashboard-scope.d.ts

@@ -1,10 +1,10 @@
 import type { ComputedRef } from 'vue';
 import type { DashboardResourceState, DashboardSourceLike, DashboardStage } from '../types/index.js';
 import type { DashboardRuntimeScopeInput } from '../types/runtime.js';
+import type { DashboardEnvironment } from '../utils/environment.js';
 import type { DashboardReadTracker } from '../utils/tracker.js';
-import { useDashboardParamScope } from './use-dashboard-param-scope.js';
 /**
- * One scope of a dashboard: the root, or one view. It owns the scope params, declares its queries
+ * One scope of a dashboard: the root, or one view. It owns the scope filters, declares its queries
  * in a single synchronous pass, instantiates them once their keys are known, and derives the scope
  * state from its essential queries.
  */
@@ -15,31 +15,34 @@ export declare function useDashboardScope(params: {
     input: DashboardRuntimeScopeInput;
     prefix: string;
     active: ComputedRef<boolean>;
+    /** The scope is part of the dashboard: always for the root, a view's `enabled` otherwise. */
+    enabled?: ComputedRef<boolean>;
     /** Dashboard auto-refresh interval in milliseconds, `0` when off. */
     refetchInterval: ComputedRef<number>;
-    /** Root params, visible inside a view's builders. */
-    shared?: ReturnType<typeof useDashboardParamScope>;
     /** Root queries and derived values, readable from a view's `derive`. */
     rootSources?: ReadonlyMap<string, DashboardSourceLike>;
     tracker: DashboardReadTracker;
+    environment: DashboardEnvironment;
 }): {
+    enabled: ComputedRef<boolean>;
+    filterScope: import("./use-dashboard-filter-scope.js").DashboardFilterScope;
     label: import("../../shared/index.js").LazyTextValue | undefined;
     members: Map<string, DashboardSourceLike<unknown>>;
-    paramScope: import("./use-dashboard-param-scope.js").DashboardParamScope;
     refresh: () => Promise<void>;
     refreshing: import("vue").ShallowRef<boolean, boolean>;
     resources: {
         activate: () => void;
         active: ComputedRef<boolean>;
         data: ComputedRef<unknown>;
-        error: import("vue").Ref<Error, Error> | import("vue").Ref<null, null>;
+        error: ComputedRef<unknown>;
         id: string;
         refresh: () => Promise<void>;
+        fetching: ComputedRef<boolean>;
         refreshing: ComputedRef<boolean>;
         stage: DashboardStage;
         state: ComputedRef<DashboardResourceState>;
         updatedAt: ComputedRef<number | undefined>;
-        widget: import("./use-dashboard-param-scope.js").DashboardParamScope;
+        filters: import("./use-dashboard-filter-scope.js").DashboardFilterScope;
     }[];
     state: ComputedRef<DashboardResourceState>;
     updatedAt: ComputedRef<number | undefined>;