@iris-ui-kit/vue 0.2.21 → 0.2.23

package/dist/admin.js

@@ -1,6 +1,6 @@
-export { IrisAdminBreadcrumb, IrisAdminLayout, IrisAdminTabs, IrisNavMenu, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, useAdminPreferences, useAdminShell, useTabsNav, visibleNav } from './chunk-4WQOZ2OV.js';
+export { IrisAdminBreadcrumb, IrisAdminLayout, IrisAdminTabs, IrisNavMenu, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, useAdminPreferences, useAdminShell, useTabsNav, visibleNav } from './chunk-QQ25RKOO.js';
 import './chunk-3FJUCHCC.js';
-import './chunk-TQB5LVOH.js';
+import './chunk-NNOF7KUH.js';
 import './chunk-F77KIPOH.js';
 import './chunk-3V46HGRC.js';
 import './chunk-ZTPIXL7Q.js';

package/dist/async.cjs

@@ -5,8 +5,31 @@ var core = require('@iris-ui-kit/core');
 
 // src/async/useAsyncResource.ts
 function useAsyncResource(fetcher, options = {}) {
+  const holder = {
+    // isRef-only resolution. NEVER toValue() here: the element type is itself
+    // a function, so toValue(fetcher) would *invoke the fetcher at setup*
+    // (spurious request) and toValue(getter) would do the same. isRef narrows
+    // to the only unambiguous reactive form: ref(fetcher) / computed(() =>
+    // fetcher) / shallowRef(fetcher) — a ComputedRef IS a Ref.
+    // F3 elision point — the ONE explicit narrowing cast: after the isRef
+    // guard the else arm is `F | (() => F)`, and the bare-getter arm's return
+    // `F` (a function) is not assignable to `F` (TS2322). No runtime
+    // discriminant distinguishes a plain fetcher from a bare getter (both are
+    // functions), so the cast encodes exactly the documented F3 ambiguity and
+    // adds no unsafety beyond F3.
+    current: vue.isRef(fetcher) ? fetcher.value : fetcher
+  };
+  if (vue.isRef(fetcher)) {
+    vue.watch(
+      fetcher,
+      (next) => {
+        holder.current = next;
+      },
+      { flush: "sync" }
+    );
+  }
   const config = "initialData" in options ? { initialData: options.initialData } : {};
-  const resource = core.createAsyncResource(fetcher, config);
+  const resource = core.createAsyncResource((...params) => holder.current(...params), config);
   const state = vue.ref(resource.getState());
   const unsubscribe = resource.subscribe((next) => {
     state.value = next;
@@ -34,7 +57,30 @@ function useAsyncResource(fetcher, options = {}) {
   };
 }
 function usePaginatedResource(fetcher, options = {}) {
-  const resource = core.createPaginatedResource(fetcher, {
+  const holder = {
+    // isRef-only resolution. NEVER toValue() here: the element type is itself
+    // a function, so toValue(fetcher) would *invoke the fetcher at setup*
+    // (spurious request) and toValue(getter) would do the same. isRef narrows
+    // to the only unambiguous reactive form: ref(fetcher) / computed(() =>
+    // fetcher) / shallowRef(fetcher) — a ComputedRef IS a Ref.
+    // F3 elision point — the ONE explicit narrowing cast: after the isRef
+    // guard the else arm is `F | (() => F)`, and the bare-getter arm's return
+    // `F` (a function) is not assignable to `F` (TS2322). No runtime
+    // discriminant distinguishes a plain fetcher from a bare getter (both are
+    // functions), so the cast encodes exactly the documented F3 ambiguity and
+    // adds no unsafety beyond F3.
+    current: vue.isRef(fetcher) ? fetcher.value : fetcher
+  };
+  if (vue.isRef(fetcher)) {
+    vue.watch(
+      fetcher,
+      (next) => {
+        holder.current = next;
+      },
+      { flush: "sync" }
+    );
+  }
+  const resource = core.createPaginatedResource((query) => holder.current(query), {
     pageSize: options.pageSize,
     mode: options.mode
   });

package/dist/async.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/async/useAsyncResource.ts","../src/async/usePaginatedResource.ts"],"names":["createAsyncResource","ref","onBeforeUnmount","onMounted","computed","createPaginatedResource"],"mappings":"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","file":"async.cjs","sourcesContent":["import { computed, onBeforeUnmount, onMounted, ref, type ComputedRef, type Ref } from 'vue'\nimport {\n  createAsyncResource,\n  type AsyncResource,\n  type AsyncResourceConfig,\n  type AsyncState,\n  type AsyncStatus,\n} from '@iris-ui-kit/core'\n\nexport interface UseAsyncResourceOptions<T> extends AsyncResourceConfig<T> {\n  /** Run `load()` (no params) once on mount. Default `false`. */\n  immediate?: boolean\n}\n\nexport interface UseAsyncResourceReturn<T, P extends unknown[]> {\n  status: ComputedRef<AsyncStatus>\n  data: ComputedRef<T | undefined>\n  error: ComputedRef<unknown>\n  isLoading: ComputedRef<boolean>\n  isError: ComputedRef<boolean>\n  load: AsyncResource<T, P>['load']\n  reload: AsyncResource<T, P>['reload']\n  mutate: AsyncResource<T, P>['mutate']\n  cancel: AsyncResource<T, P>['cancel']\n  reset: AsyncResource<T, P>['reset']\n}\n\n/**\n * Vue binding for the framework-agnostic async resource. Creates the resource\n * in `setup()` (runs once, so the fetcher closure stays live) and bridges its\n * state into computed refs.\n *\n * ```ts\n * const users = useAsyncResource(() => api.listUsers(), { immediate: true })\n * // <IrisTable :data=\"users.data.value ?? []\" :loading=\"users.isLoading.value\" />\n * ```\n */\nexport function useAsyncResource<T, P extends unknown[] = []>(\n  fetcher: (...params: P) => Promise<T>,\n  options: UseAsyncResourceOptions<T> = {},\n): UseAsyncResourceReturn<T, P> {\n  const config: AsyncResourceConfig<T> =\n    'initialData' in options ? { initialData: options.initialData } : {}\n  const resource = createAsyncResource<T, P>(fetcher, config)\n\n  const state = ref(resource.getState()) as Ref<AsyncState<T>>\n  const unsubscribe = resource.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(() => {\n    unsubscribe()\n    // Abort any in-flight request on unmount so it can't write back into an\n    // unmounted component (and cancels the underlying request when the fetcher\n    // honors `signal`). Idempotent and safe with no in-flight load.\n    resource.cancel()\n  })\n\n  if (options.immediate) {\n    onMounted(() => {\n      void resource.load(...([] as unknown as P))\n    })\n  }\n\n  return {\n    status: computed(() => state.value.status),\n    data: computed(() => state.value.data),\n    error: computed(() => state.value.error),\n    isLoading: computed(() => state.value.status === 'loading'),\n    isError: computed(() => state.value.status === 'error'),\n    load: resource.load,\n    reload: resource.reload,\n    mutate: resource.mutate,\n    cancel: resource.cancel,\n    reset: resource.reset,\n  }\n}\n","import { computed, onBeforeUnmount, onMounted, ref, type ComputedRef, type Ref } from 'vue'\nimport {\n  createPaginatedResource,\n  type PageQuery,\n  type PageResult,\n  type PaginatedResource,\n  type PaginatedState,\n  type PaginationMode,\n} from '@iris-ui-kit/core'\n\nexport interface UsePaginatedResourceOptions {\n  pageSize?: number\n  mode?: PaginationMode\n  /** Load the first page on mount (page 1, or `loadMore` in infinite mode). */\n  immediate?: boolean\n}\n\nexport interface UsePaginatedResourceReturn<T> {\n  status: ComputedRef<PaginatedState<T>['status']>\n  items: ComputedRef<T[]>\n  page: ComputedRef<number>\n  pageSize: ComputedRef<number>\n  total: ComputedRef<number | undefined>\n  error: ComputedRef<unknown>\n  isLoading: ComputedRef<boolean>\n  isError: ComputedRef<boolean>\n  hasMore: ComputedRef<boolean>\n  goToPage: PaginatedResource<T>['goToPage']\n  loadMore: PaginatedResource<T>['loadMore']\n  refresh: PaginatedResource<T>['refresh']\n  setPageSize: PaginatedResource<T>['setPageSize']\n}\n\n/**\n * Vue binding for the server-side pagination resource. Created in `setup()`\n * (fetcher closure stays live) and bridged to computed refs.\n */\nexport function usePaginatedResource<T>(\n  fetcher: (query: PageQuery) => Promise<PageResult<T>>,\n  options: UsePaginatedResourceOptions = {},\n): UsePaginatedResourceReturn<T> {\n  const resource = createPaginatedResource<T>(fetcher, {\n    pageSize: options.pageSize,\n    mode: options.mode,\n  })\n\n  const state = ref(resource.getState()) as Ref<PaginatedState<T>>\n  const unsubscribe = resource.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(unsubscribe)\n\n  if (options.immediate) {\n    onMounted(() => {\n      void (options.mode === 'infinite' ? resource.loadMore() : resource.goToPage(1))\n    })\n  }\n\n  return {\n    status: computed(() => state.value.status),\n    items: computed(() => state.value.items),\n    page: computed(() => state.value.page),\n    pageSize: computed(() => state.value.pageSize),\n    total: computed(() => state.value.total),\n    error: computed(() => state.value.error),\n    isLoading: computed(() => state.value.status === 'loading'),\n    isError: computed(() => state.value.status === 'error'),\n    // Touch state so this recomputes on every store change; hasMore() then\n    // reads the resource's fresh internal batch state.\n    hasMore: computed(() => {\n      void state.value\n      return resource.hasMore()\n    }),\n    goToPage: resource.goToPage,\n    loadMore: resource.loadMore,\n    refresh: resource.refresh,\n    setPageSize: resource.setPageSize,\n  }\n}\n"]}
+{"version":3,"sources":["../src/async/useAsyncResource.ts","../src/async/usePaginatedResource.ts"],"names":["isRef","watch","createAsyncResource","ref","onBeforeUnmount","onMounted","computed","createPaginatedResource"],"mappings":"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","file":"async.cjs","sourcesContent":["import {\n  computed,\n  isRef,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  watch,\n  type ComputedRef,\n  type MaybeRefOrGetter,\n  type Ref,\n} from 'vue'\nimport {\n  createAsyncResource,\n  type AsyncResource,\n  type AsyncResourceConfig,\n  type AsyncState,\n  type AsyncStatus,\n} from '@iris-ui-kit/core'\n\nexport interface UseAsyncResourceOptions<T> extends AsyncResourceConfig<T> {\n  /** Run `load()` (no params) once on mount. Default `false`. */\n  immediate?: boolean\n}\n\nexport interface UseAsyncResourceReturn<T, P extends unknown[]> {\n  status: ComputedRef<AsyncStatus>\n  data: ComputedRef<T | undefined>\n  error: ComputedRef<unknown>\n  isLoading: ComputedRef<boolean>\n  isError: ComputedRef<boolean>\n  load: AsyncResource<T, P>['load']\n  reload: AsyncResource<T, P>['reload']\n  mutate: AsyncResource<T, P>['mutate']\n  cancel: AsyncResource<T, P>['cancel']\n  reset: AsyncResource<T, P>['reset']\n}\n\n/**\n * Vue binding for the framework-agnostic async resource. Creates the resource\n * in `setup()` (runs once, so the fetcher closure stays live) and bridges its\n * state into computed refs.\n *\n * ```ts\n * const users = useAsyncResource(() => api.listUsers(), { immediate: true })\n * // <IrisTable :data=\"users.data.value ?? []\" :loading=\"users.isLoading.value\" />\n * ```\n *\n * The fetcher may be reactive — pass `ref(fetcher)` or `computed(() => fetcher)`\n * and the *current* closure is used on every `load()`/`reload()`. Updating it\n * does NOT auto-refetch; call `reload()` yourself:\n *\n * ```ts\n * const users = useAsyncResource(computed(() => api.listUsers(props.id)), { immediate: true })\n * watch(() => props.id, () => void users.reload())\n * ```\n *\n * A bare getter `() => fetcher` is indistinguishable from a plain zero-arg\n * fetcher and is treated as one — use `computed`/`ref` for reactive fetchers.\n */\nexport function useAsyncResource<T, P extends unknown[] = []>(\n  fetcher: MaybeRefOrGetter<(...params: P) => Promise<T>>,\n  options: UseAsyncResourceOptions<T> = {},\n): UseAsyncResourceReturn<T, P> {\n  // Plain-object holder (the Vue analog of React's `latest.current` ref):\n  // core only ever sees the wrapper below, which re-reads `holder.current` at\n  // call time — so `load()`, `reload()` and its `lastParams` replay all use\n  // the fresh closure for the component's whole lifetime.\n  const holder: { current: (...params: P) => Promise<T> } = {\n    // isRef-only resolution. NEVER toValue() here: the element type is itself\n    // a function, so toValue(fetcher) would *invoke the fetcher at setup*\n    // (spurious request) and toValue(getter) would do the same. isRef narrows\n    // to the only unambiguous reactive form: ref(fetcher) / computed(() =>\n    // fetcher) / shallowRef(fetcher) — a ComputedRef IS a Ref.\n    // F3 elision point — the ONE explicit narrowing cast: after the isRef\n    // guard the else arm is `F | (() => F)`, and the bare-getter arm's return\n    // `F` (a function) is not assignable to `F` (TS2322). No runtime\n    // discriminant distinguishes a plain fetcher from a bare getter (both are\n    // functions), so the cast encodes exactly the documented F3 ambiguity and\n    // adds no unsafety beyond F3.\n    current: (isRef(fetcher) ? fetcher.value : fetcher) as (...params: P) => Promise<T>,\n  }\n  if (isRef(fetcher)) {\n    // Ref sources only. watch(fn, cb) would treat a plain function source as a\n    // getter: evaluate it once at setup (spurious fetcher invocation) and track\n    // its deps. flush: 'sync' (precedent useAdminShell.ts:67) guarantees a\n    // load()/reload() in the same tick as the ref assignment sees the new\n    // closure. Plain-object holder => the swap is not reactive, no re-render.\n    watch(\n      fetcher,\n      (next) => {\n        holder.current = next\n      },\n      { flush: 'sync' },\n    )\n  }\n\n  const config: AsyncResourceConfig<T> =\n    'initialData' in options ? { initialData: options.initialData } : {}\n  const resource = createAsyncResource<T, P>((...params) => holder.current(...params), config)\n\n  const state = ref(resource.getState()) as Ref<AsyncState<T>>\n  const unsubscribe = resource.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(() => {\n    unsubscribe()\n    // Abort any in-flight request on unmount so it can't write back into an\n    // unmounted component (and cancels the underlying request when the fetcher\n    // honors `signal`). Idempotent and safe with no in-flight load.\n    resource.cancel()\n  })\n\n  if (options.immediate) {\n    onMounted(() => {\n      void resource.load(...([] as unknown as P))\n    })\n  }\n\n  return {\n    status: computed(() => state.value.status),\n    data: computed(() => state.value.data),\n    error: computed(() => state.value.error),\n    isLoading: computed(() => state.value.status === 'loading'),\n    isError: computed(() => state.value.status === 'error'),\n    load: resource.load,\n    reload: resource.reload,\n    mutate: resource.mutate,\n    cancel: resource.cancel,\n    reset: resource.reset,\n  }\n}\n","import {\n  computed,\n  isRef,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  watch,\n  type ComputedRef,\n  type MaybeRefOrGetter,\n  type Ref,\n} from 'vue'\nimport {\n  createPaginatedResource,\n  type PageQuery,\n  type PageResult,\n  type PaginatedResource,\n  type PaginatedState,\n  type PaginationMode,\n} from '@iris-ui-kit/core'\n\nexport interface UsePaginatedResourceOptions {\n  pageSize?: number\n  mode?: PaginationMode\n  /** Load the first page on mount (page 1, or `loadMore` in infinite mode). */\n  immediate?: boolean\n}\n\nexport interface UsePaginatedResourceReturn<T> {\n  status: ComputedRef<PaginatedState<T>['status']>\n  items: ComputedRef<T[]>\n  page: ComputedRef<number>\n  pageSize: ComputedRef<number>\n  total: ComputedRef<number | undefined>\n  error: ComputedRef<unknown>\n  isLoading: ComputedRef<boolean>\n  isError: ComputedRef<boolean>\n  hasMore: ComputedRef<boolean>\n  goToPage: PaginatedResource<T>['goToPage']\n  loadMore: PaginatedResource<T>['loadMore']\n  refresh: PaginatedResource<T>['refresh']\n  setPageSize: PaginatedResource<T>['setPageSize']\n}\n\n/**\n * Vue binding for the server-side pagination resource. Created in `setup()`\n * (fetcher closure stays live) and bridged to computed refs.\n *\n * The fetcher may be reactive — pass `ref(fetcher)` or `computed(() => fetcher)`\n * and the *current* closure is used on every page load (`goToPage`/`loadMore`/\n * `refresh`). Updating it does NOT auto-refetch; trigger a load yourself:\n *\n * ```ts\n * const p = usePaginatedResource(computed(() => api.listUsers(props.id)))\n * watch(() => props.id, () => void p.refresh())\n * ```\n *\n * A bare getter `() => fetcher` is indistinguishable from a plain fetcher and\n * is treated as one — use `computed`/`ref` for reactive fetchers.\n */\nexport function usePaginatedResource<T>(\n  fetcher: MaybeRefOrGetter<(query: PageQuery) => Promise<PageResult<T>>>,\n  options: UsePaginatedResourceOptions = {},\n): UsePaginatedResourceReturn<T> {\n  // Plain-object holder (the Vue analog of React's `latest.current` ref):\n  // core only ever sees the wrapper below, which re-reads `holder.current` at\n  // call time — so every page load (and `refresh`'s replay) uses the fresh\n  // closure for the component's whole lifetime.\n  const holder: { current: (query: PageQuery) => Promise<PageResult<T>> } = {\n    // isRef-only resolution. NEVER toValue() here: the element type is itself\n    // a function, so toValue(fetcher) would *invoke the fetcher at setup*\n    // (spurious request) and toValue(getter) would do the same. isRef narrows\n    // to the only unambiguous reactive form: ref(fetcher) / computed(() =>\n    // fetcher) / shallowRef(fetcher) — a ComputedRef IS a Ref.\n    // F3 elision point — the ONE explicit narrowing cast: after the isRef\n    // guard the else arm is `F | (() => F)`, and the bare-getter arm's return\n    // `F` (a function) is not assignable to `F` (TS2322). No runtime\n    // discriminant distinguishes a plain fetcher from a bare getter (both are\n    // functions), so the cast encodes exactly the documented F3 ambiguity and\n    // adds no unsafety beyond F3.\n    current: (isRef(fetcher) ? fetcher.value : fetcher) as (\n      query: PageQuery,\n    ) => Promise<PageResult<T>>,\n  }\n  if (isRef(fetcher)) {\n    // Ref sources only. watch(fn, cb) would treat a plain function source as a\n    // getter: evaluate it once at setup (spurious fetcher invocation) and track\n    // its deps. flush: 'sync' (precedent useAdminShell.ts:67) guarantees a\n    // page load in the same tick as the ref assignment sees the new closure.\n    // Plain-object holder => the swap is not reactive, no re-render.\n    watch(\n      fetcher,\n      (next) => {\n        holder.current = next\n      },\n      { flush: 'sync' },\n    )\n  }\n\n  const resource = createPaginatedResource<T>((query) => holder.current(query), {\n    pageSize: options.pageSize,\n    mode: options.mode,\n  })\n\n  const state = ref(resource.getState()) as Ref<PaginatedState<T>>\n  const unsubscribe = resource.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(unsubscribe)\n\n  if (options.immediate) {\n    onMounted(() => {\n      void (options.mode === 'infinite' ? resource.loadMore() : resource.goToPage(1))\n    })\n  }\n\n  return {\n    status: computed(() => state.value.status),\n    items: computed(() => state.value.items),\n    page: computed(() => state.value.page),\n    pageSize: computed(() => state.value.pageSize),\n    total: computed(() => state.value.total),\n    error: computed(() => state.value.error),\n    isLoading: computed(() => state.value.status === 'loading'),\n    isError: computed(() => state.value.status === 'error'),\n    // Touch state so this recomputes on every store change; hasMore() then\n    // reads the resource's fresh internal batch state.\n    hasMore: computed(() => {\n      void state.value\n      return resource.hasMore()\n    }),\n    goToPage: resource.goToPage,\n    loadMore: resource.loadMore,\n    refresh: resource.refresh,\n    setPageSize: resource.setPageSize,\n  }\n}\n"]}

package/dist/async.d.cts

@@ -1,4 +1,4 @@
-import { ComputedRef } from 'vue';
+import { ComputedRef, MaybeRefOrGetter } from 'vue';
 import { AsyncResourceConfig, AsyncStatus, AsyncResource, PaginationMode, PaginatedState, PaginatedResource, PageQuery, PageResult } from '@iris-ui-kit/core';
 
 interface UseAsyncResourceOptions<T> extends AsyncResourceConfig<T> {
@@ -26,8 +26,20 @@ interface UseAsyncResourceReturn<T, P extends unknown[]> {
  * const users = useAsyncResource(() => api.listUsers(), { immediate: true })
  * // <IrisTable :data="users.data.value ?? []" :loading="users.isLoading.value" />
  * ```
+ *
+ * The fetcher may be reactive — pass `ref(fetcher)` or `computed(() => fetcher)`
+ * and the *current* closure is used on every `load()`/`reload()`. Updating it
+ * does NOT auto-refetch; call `reload()` yourself:
+ *
+ * ```ts
+ * const users = useAsyncResource(computed(() => api.listUsers(props.id)), { immediate: true })
+ * watch(() => props.id, () => void users.reload())
+ * ```
+ *
+ * A bare getter `() => fetcher` is indistinguishable from a plain zero-arg
+ * fetcher and is treated as one — use `computed`/`ref` for reactive fetchers.
  */
-declare function useAsyncResource<T, P extends unknown[] = []>(fetcher: (...params: P) => Promise<T>, options?: UseAsyncResourceOptions<T>): UseAsyncResourceReturn<T, P>;
+declare function useAsyncResource<T, P extends unknown[] = []>(fetcher: MaybeRefOrGetter<(...params: P) => Promise<T>>, options?: UseAsyncResourceOptions<T>): UseAsyncResourceReturn<T, P>;
 
 interface UsePaginatedResourceOptions {
     pageSize?: number;
@@ -53,7 +65,19 @@ interface UsePaginatedResourceReturn<T> {
 /**
  * Vue binding for the server-side pagination resource. Created in `setup()`
  * (fetcher closure stays live) and bridged to computed refs.
+ *
+ * The fetcher may be reactive — pass `ref(fetcher)` or `computed(() => fetcher)`
+ * and the *current* closure is used on every page load (`goToPage`/`loadMore`/
+ * `refresh`). Updating it does NOT auto-refetch; trigger a load yourself:
+ *
+ * ```ts
+ * const p = usePaginatedResource(computed(() => api.listUsers(props.id)))
+ * watch(() => props.id, () => void p.refresh())
+ * ```
+ *
+ * A bare getter `() => fetcher` is indistinguishable from a plain fetcher and
+ * is treated as one — use `computed`/`ref` for reactive fetchers.
  */
-declare function usePaginatedResource<T>(fetcher: (query: PageQuery) => Promise<PageResult<T>>, options?: UsePaginatedResourceOptions): UsePaginatedResourceReturn<T>;
+declare function usePaginatedResource<T>(fetcher: MaybeRefOrGetter<(query: PageQuery) => Promise<PageResult<T>>>, options?: UsePaginatedResourceOptions): UsePaginatedResourceReturn<T>;
 
 export { type UseAsyncResourceOptions, type UseAsyncResourceReturn, type UsePaginatedResourceOptions, type UsePaginatedResourceReturn, useAsyncResource, usePaginatedResource };

package/dist/async.d.ts

@@ -1,4 +1,4 @@
-import { ComputedRef } from 'vue';
+import { ComputedRef, MaybeRefOrGetter } from 'vue';
 import { AsyncResourceConfig, AsyncStatus, AsyncResource, PaginationMode, PaginatedState, PaginatedResource, PageQuery, PageResult } from '@iris-ui-kit/core';
 
 interface UseAsyncResourceOptions<T> extends AsyncResourceConfig<T> {
@@ -26,8 +26,20 @@ interface UseAsyncResourceReturn<T, P extends unknown[]> {
  * const users = useAsyncResource(() => api.listUsers(), { immediate: true })
  * // <IrisTable :data="users.data.value ?? []" :loading="users.isLoading.value" />
  * ```
+ *
+ * The fetcher may be reactive — pass `ref(fetcher)` or `computed(() => fetcher)`
+ * and the *current* closure is used on every `load()`/`reload()`. Updating it
+ * does NOT auto-refetch; call `reload()` yourself:
+ *
+ * ```ts
+ * const users = useAsyncResource(computed(() => api.listUsers(props.id)), { immediate: true })
+ * watch(() => props.id, () => void users.reload())
+ * ```
+ *
+ * A bare getter `() => fetcher` is indistinguishable from a plain zero-arg
+ * fetcher and is treated as one — use `computed`/`ref` for reactive fetchers.
  */
-declare function useAsyncResource<T, P extends unknown[] = []>(fetcher: (...params: P) => Promise<T>, options?: UseAsyncResourceOptions<T>): UseAsyncResourceReturn<T, P>;
+declare function useAsyncResource<T, P extends unknown[] = []>(fetcher: MaybeRefOrGetter<(...params: P) => Promise<T>>, options?: UseAsyncResourceOptions<T>): UseAsyncResourceReturn<T, P>;
 
 interface UsePaginatedResourceOptions {
     pageSize?: number;
@@ -53,7 +65,19 @@ interface UsePaginatedResourceReturn<T> {
 /**
  * Vue binding for the server-side pagination resource. Created in `setup()`
  * (fetcher closure stays live) and bridged to computed refs.
+ *
+ * The fetcher may be reactive — pass `ref(fetcher)` or `computed(() => fetcher)`
+ * and the *current* closure is used on every page load (`goToPage`/`loadMore`/
+ * `refresh`). Updating it does NOT auto-refetch; trigger a load yourself:
+ *
+ * ```ts
+ * const p = usePaginatedResource(computed(() => api.listUsers(props.id)))
+ * watch(() => props.id, () => void p.refresh())
+ * ```
+ *
+ * A bare getter `() => fetcher` is indistinguishable from a plain fetcher and
+ * is treated as one — use `computed`/`ref` for reactive fetchers.
  */
-declare function usePaginatedResource<T>(fetcher: (query: PageQuery) => Promise<PageResult<T>>, options?: UsePaginatedResourceOptions): UsePaginatedResourceReturn<T>;
+declare function usePaginatedResource<T>(fetcher: MaybeRefOrGetter<(query: PageQuery) => Promise<PageResult<T>>>, options?: UsePaginatedResourceOptions): UsePaginatedResourceReturn<T>;
 
 export { type UseAsyncResourceOptions, type UseAsyncResourceReturn, type UsePaginatedResourceOptions, type UsePaginatedResourceReturn, useAsyncResource, usePaginatedResource };

package/dist/async.js

@@ -1,3 +1,3 @@
-export { useAsyncResource, usePaginatedResource } from './chunk-ZY4NLITM.js';
+export { useAsyncResource, usePaginatedResource } from './chunk-SJB5DIIY.js';
 //# sourceMappingURL=async.js.map
 //# sourceMappingURL=async.js.map

package/dist/behaviors.cjs

@@ -127,6 +127,72 @@ function handlePosition(handle) {
   s.cursor = HANDLE_CURSORS[handle];
   return s;
 }
+var ResizableHandle = vue.defineComponent({
+  name: "ResizableHandle",
+  props: {
+    handle: { type: String, required: true },
+    disabled: { type: Boolean, default: false },
+    keepAspect: { type: Boolean, default: false },
+    minWidth: { type: Number, default: 40 },
+    minHeight: { type: Number, default: 40 },
+    maxWidth: { type: Number, default: Infinity },
+    maxHeight: { type: Number, default: Infinity },
+    /** Stable computed ref from the parent; read only (never mutated). */
+    sizeRef: { type: Object, required: true },
+    /** Stable setup-level callbacks from the parent. */
+    onUpdate: { type: Function, required: true },
+    onResizeStart: {
+      type: Function,
+      default: void 0
+    },
+    onResizeEnd: { type: Function, default: void 0 }
+  },
+  setup(props) {
+    const handleRef = vue.ref(null);
+    let startSize = { width: 0, height: 0 };
+    let aspect = 1;
+    useDrag({
+      handle: handleRef,
+      disabled: vue.computed(() => props.disabled),
+      onStart: () => {
+        startSize = { ...props.sizeRef.value };
+        aspect = startSize.width / Math.max(1, startSize.height);
+        props.onResizeStart?.(startSize);
+      },
+      onDrag: ({ dx, dy }) => {
+        const t = props.handle.includes("top");
+        const b = props.handle.includes("bottom");
+        const l = props.handle.includes("left");
+        const r = props.handle.includes("right");
+        let nextW = startSize.width;
+        let nextH = startSize.height;
+        if (r) nextW = startSize.width + dx;
+        if (l) nextW = startSize.width - dx;
+        if (b) nextH = startSize.height + dy;
+        if (t) nextH = startSize.height - dy;
+        if (props.keepAspect && (t || b) && (l || r)) {
+          nextH = nextW / aspect;
+        }
+        nextW = Math.max(props.minWidth, Math.min(props.maxWidth, nextW));
+        nextH = Math.max(props.minHeight, Math.min(props.maxHeight, nextH));
+        props.onUpdate({ width: nextW, height: nextH });
+      },
+      onEnd: () => props.onResizeEnd?.()
+    });
+    return () => vue.h("div", {
+      ref: (el) => {
+        handleRef.value = el ?? null;
+      },
+      "data-iris-resizable-handle": props.handle,
+      style: {
+        ...handlePosition(props.handle),
+        touchAction: "none",
+        background: "transparent",
+        zIndex: "1"
+      }
+    });
+  }
+});
 var IrisResizable = vue.defineComponent({
   name: "IrisResizable",
   inheritAttrs: false,
@@ -159,53 +225,8 @@ var IrisResizable = vue.defineComponent({
       if (!isControlled.value) internal.value = next;
       emit("update:size", next);
     };
-    const renderHandle = (handle) => {
-      const handleRef = vue.ref(null);
-      let startSize = { width: 0, height: 0 };
-      let aspect = 1;
-      useDrag({
-        handle: handleRef,
-        disabled: vue.computed(() => props.disabled),
-        onStart: () => {
-          startSize = { ...size.value };
-          aspect = startSize.width / Math.max(1, startSize.height);
-          emit("resizeStart", startSize);
-        },
-        onDrag: ({ dx, dy }) => {
-          const t = handle.includes("top");
-          const b = handle.includes("bottom");
-          const l = handle.includes("left");
-          const r = handle.includes("right");
-          let nextW = startSize.width;
-          let nextH = startSize.height;
-          if (r) nextW = startSize.width + dx;
-          if (l) nextW = startSize.width - dx;
-          if (b) nextH = startSize.height + dy;
-          if (t) nextH = startSize.height - dy;
-          if (props.keepAspect && (t || b) && (l || r)) {
-            nextH = nextW / aspect;
-          }
-          nextW = Math.max(props.minWidth, Math.min(props.maxWidth, nextW));
-          nextH = Math.max(props.minHeight, Math.min(props.maxHeight, nextH));
-          setSize({ width: nextW, height: nextH });
-        },
-        onEnd: () => {
-          emit("resizeEnd", size.value);
-        }
-      });
-      return vue.h("div", {
-        ref: (el) => {
-          handleRef.value = el ?? null;
-        },
-        "data-iris-resizable-handle": handle,
-        style: {
-          ...handlePosition(handle),
-          touchAction: "none",
-          background: "transparent",
-          zIndex: "1"
-        }
-      });
-    };
+    const emitResizeStart = (s) => emit("resizeStart", s);
+    const emitResizeEnd = () => emit("resizeEnd", size.value);
     return () => vue.h(
       "div",
       {
@@ -220,7 +241,25 @@ var IrisResizable = vue.defineComponent({
           ...attrs.style ?? {}
         }
       },
-      [slots.default?.(), ...props.handles.map(renderHandle)]
+      [
+        slots.default?.(),
+        ...props.handles.map(
+          (handle) => vue.h(ResizableHandle, {
+            key: handle,
+            handle,
+            disabled: props.disabled,
+            keepAspect: props.keepAspect,
+            minWidth: props.minWidth,
+            minHeight: props.minHeight,
+            maxWidth: props.maxWidth,
+            maxHeight: props.maxHeight,
+            sizeRef: size,
+            onUpdate: setSize,
+            onResizeStart: emitResizeStart,
+            onResizeEnd: emitResizeEnd
+          })
+        )
+      ]
     );
   }
 });