@commercelayer/app-elements 7.12.0 → 7.14.0

package/dist/ui/resources/ResourceTags.d.ts

@@ -1,9 +1,28 @@
 import { ListableResourceType } from '@commercelayer/sdk';
 import { EditTagsOverlayProps } from '../../hooks/useEditTagsOverlay';
-type TaggableResource = Extract<ListableResourceType, "addresses" | "bundles" | "coupons" | "customers" | "gift_cards" | "line_items" | "line_item_options" | "order_subscriptions" | "orders" | "buy_x_pay_y_promotions" | "external_promotions" | "fixed_amount_promotions" | "fixed_price_promotions" | "flex_promotions" | "free_gift_promotions" | "free_shipping_promotions" | "percentage_discount_promotions" | "returns" | "shipments" | "shipping_methods" | "sku_options" | "skus">;
+/**
+ * The resources the API can tag, as a value so that a caller can ask at runtime —
+ * `ResourceAdminBlocks` leaves the block out for a stock item or an import.
+ *
+ * The SDK declares an `isTaggable()` helper and a `taggableResources` array in its
+ * types but ships neither in its build, so calling them typechecks and then throws.
+ * Hence our own list, checked against `ListableResourceType` by `satisfies`.
+ */
+export declare const taggableResources: readonly ["addresses", "bundles", "coupons", "customers", "gift_cards", "line_items", "line_item_options", "order_subscriptions", "orders", "buy_x_pay_y_promotions", "external_promotions", "fixed_amount_promotions", "fixed_price_promotions", "flex_promotions", "free_gift_promotions", "free_shipping_promotions", "percentage_discount_promotions", "returns", "shipments", "shipping_methods", "sku_options", "skus"];
+export type TaggableResource = (typeof taggableResources)[number];
+/** Whether the API can tag this resource. */
+export declare function isTaggableResource(resourceType: ListableResourceType): resourceType is TaggableResource;
 interface TagsOverlay extends Omit<EditTagsOverlayProps, "resourceId" | "resourceType"> {
 }
 export interface ResourceTagsProps {
+    /**
+     * How the block renders, overriding what it infers from where it sits.
+     *
+     * Inferred by default — `PageLayout`'s sidebar slot reports `"sidebar"`, while a
+     * page and a drawer both report the wider `"default"`. Pass it only to force a
+     * rendering the surrounding surface would not choose.
+     */
+    variant?: "default" | "sidebar";
     resourceType: TaggableResource;
     resourceId: string;
     /**
@@ -19,6 +38,7 @@ export interface ResourceTagsProps {
  * This component generates an all-in-one visualization and editing interface for managing tags relationship of requested resource.
  */
 export declare const ResourceTags: import('../atoms/SkeletonTemplate').SkeletonTemplateComponent<{
+    variant?: "default" | "sidebar" | undefined;
     resourceType: TaggableResource;
     resourceId: string;
     overlay?: TagsOverlay

package/dist/ui/resources/ResourceTags.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ui/resources/useResourceFilters/FieldOptionsSelect.d.ts

@@ -0,0 +1,20 @@
+import { JSX } from 'react';
+import { FilterItemOptions } from './types';
+type SelectRender = Extract<FilterItemOptions["render"], {
+    component: "inputSelect";
+}>;
+/**
+ * Renders an `options` filter as a (multi) select dropdown, the style used by the
+ * dashboard metrics filters.
+ *
+ * Options come from the Core API. Anything already selected is fetched
+ * separately, so its label resolves even when it is not in the first page, and
+ * when `searchBy` is set typing searches server-side instead of filtering only
+ * what has been loaded.
+ */
+export declare function FieldOptionsSelect({ item, }: {
+    item: FilterItemOptions & {
+        render: SelectRender;
+    };
+}): JSX.Element | null;
+export {};

package/dist/ui/resources/useResourceFilters/FiltersBar.d.ts

@@ -0,0 +1,64 @@
+import { JSX, ReactNode } from 'react';
+import { FiltersInstructions, FormFullValues } from './types';
+export interface FiltersBarProps {
+    /**
+     * Url query string to be parsed.
+     * It must be "reactive", so most of the time it should come from the router.
+     */
+    queryString: string;
+    /**
+     * Callback triggered when the user interacts with the search bar or removes a
+     * filter. The implementation should update the url query string.
+     */
+    onUpdate: (newQueryString: string) => void;
+    /**
+     * Filters that are already implied by the current view, typically the ones
+     * defining the active tab.
+     *
+     * They are not rendered as pills, removing a pill reverts that single filter
+     * back to the value defined here, and "clear all" reverts to this set rather
+     * than to no filters at all.
+     */
+    defaultValues?: FormFullValues;
+    /**
+     * Overrides the filters button behavior. When set, the built-in drawer is not
+     * opened and the app is responsible for rendering the filters form — for
+     * example by navigating to a dedicated filters page.
+     */
+    onFilterClick?: () => void;
+    /**
+     * Placeholder text for the search bar
+     * @default 'Search...'
+     */
+    searchBarPlaceholder?: string;
+    /**
+     * Milliseconds to wait before triggering the search bar callback
+     * @default 500
+     */
+    searchBarDebounceMs?: number;
+    /**
+     * Hide the search bar, keeping the filters button and the pills.
+     * @default false
+     */
+    hideSearchBar?: boolean;
+    /**
+     * Rendered to the right of the filters button, for page level actions such as
+     * an export button.
+     */
+    actions?: ReactNode;
+}
+interface InternalProps {
+    instructions: FiltersInstructions;
+    predicateWhitelist: string[];
+    /** Opens the drawer rendered by `FiltersDrawer`. */
+    openDrawer: () => void;
+}
+/**
+ * Search bar with the filters button on the right and the applied filters
+ * rendered as removable pills below.
+ */
+export declare function FiltersBar({ queryString, onUpdate, defaultValues, onFilterClick, searchBarPlaceholder, searchBarDebounceMs, hideSearchBar, actions, instructions, predicateWhitelist, openDrawer, }: FiltersBarProps & InternalProps): JSX.Element;
+export declare namespace FiltersBar {
+    var displayName: string;
+}
+export {};

package/dist/ui/resources/useResourceFilters/FiltersDrawer.d.ts

@@ -0,0 +1,35 @@
+import { JSX } from 'react';
+import { OverlayProps } from '../../internals/Overlay';
+import { FiltersInstructions } from './types';
+export interface FiltersDrawerProps {
+    /**
+     * Callback triggered when the user applies the filters.
+     * The implementation should update the url query string.
+     */
+    onUpdate: (newQueryString: string) => void;
+    /**
+     * Title of the drawer
+     * @default 'Filters'
+     */
+    title?: string;
+}
+interface InternalProps {
+    instructions: FiltersInstructions;
+    predicateWhitelist: string[];
+    /** Overlay component from the hook, shared with the bar's filters button. */
+    Overlay: React.FC<OverlayProps>;
+    close: () => void;
+    /** Current url query string, from the hook scope. */
+    queryString: string;
+}
+/**
+ * Side drawer containing the filters form, opened by the `FiltersBar` filters
+ * button.
+ *
+ * Render it once per page, as a sibling of `FiltersBar`.
+ */
+export declare function FiltersDrawer({ onUpdate, title, instructions, predicateWhitelist, Overlay, close, queryString, }: FiltersDrawerProps & InternalProps): JSX.Element;
+export declare namespace FiltersDrawer {
+    var displayName: string;
+}
+export {};

package/dist/ui/resources/useResourceFilters/FiltersSearchBar.d.ts

@@ -1,7 +1,7 @@
 import { JSX } from 'react';
 import { SearchBarProps } from '../../composite/SearchBar';
 import { FiltersInstructions } from './types';
-export interface FilterSearchBarProps extends Pick<SearchBarProps, "placeholder" | "debounceMs"> {
+export interface FilterSearchBarProps extends Pick<SearchBarProps, "placeholder" | "debounceMs" | "variant"> {
     /**
      * Array of instruction items to build the filters behaviors
      */
@@ -31,7 +31,7 @@ export interface FilterSearchBarProps extends Pick<SearchBarProps, "placeholder"
      */
     predicateWhitelist: string[];
 }
-declare function FiltersSearchBar({ instructions, placeholder, onUpdate, queryString, predicateWhitelist, debounceMs, }: FilterSearchBarProps): JSX.Element;
+declare function FiltersSearchBar({ instructions, placeholder, onUpdate, queryString, predicateWhitelist, debounceMs, variant, }: FilterSearchBarProps): JSX.Element;
 declare namespace FiltersSearchBar {
     var displayName: string;
 }

package/dist/ui/resources/useResourceFilters/activeFilters.d.ts

@@ -0,0 +1,111 @@
+import { ListableResourceType } from '@commercelayer/sdk';
+import { formatDateRange } from '../../../helpers/date';
+import { CurrencyRangeFieldValue, FiltersInstructionItem, FiltersInstructions, FormFullValues, UiFilterValue } from './types';
+/**
+ * Shared helpers to read the active filters out of a url query string and turn
+ * them into human readable labels.
+ *
+ * Used by both `FiltersNav` (legacy `ButtonFilter` look) and `FiltersBar`
+ * (metrics-style pills), so label resolution only ever has one implementation.
+ */
+export declare function getInstructionItemByFilterPredicate({ instructions, filterPredicate, }: {
+    instructions: FiltersInstructions;
+    filterPredicate: string;
+}): FiltersInstructionItem | undefined;
+/**
+ * Get label for user defined ButtonFilter component by reading the `instructionItem` object.
+ * If the filter has options and only one value is selected, the label will be the option label.
+ * Otherwise, the label will be the filter group label plus the number of selected values.
+ */
+export declare function getButtonFilterLabel({ values, instructionItem, }: {
+    values: string | string[];
+    instructionItem: FiltersInstructionItem;
+}): string;
+export declare function extractCurrencyRangeFilterValues({ activeFilters, instructions, }: {
+    activeFilters: Array<[string, UiFilterValue]>;
+    instructions: FiltersInstructions;
+}): Array<[string, CurrencyRangeFieldValue]>;
+/**
+ * Checks if a filter predicate belongs to a currency range filter
+ * by checking the instructions
+ */
+export declare function predicateBelongsToCurrencyRange({ filterPredicate, instructions, }: {
+    filterPredicate: string;
+    instructions: FiltersInstructions;
+}): boolean;
+export declare function makeCurrencyRangeFilterButtonLabel(value: CurrencyRangeFieldValue): string;
+/**
+ * Resolves every selected value to its option label and joins them.
+ *
+ * Unlike {@link getButtonFilterLabel}, which collapses multiple values into a
+ * counter (`Markets · 2`), this spells them all out (`Europe, Italy`) because a
+ * pill already shows the filter name separately.
+ */
+export declare function formatPillFilterValue({ values, instructionItem, }: {
+    values: string | string[];
+    instructionItem: FiltersInstructionItem;
+}): string;
+/**
+ * Compares two filter values ignoring array wrapping and ordering, so that
+ * `"placed"`, `["placed"]` and `["placed"]` in a different order all match.
+ * Range values (objects) are compared as-is.
+ */
+export declare function isSameFilterValue(a: unknown, b: unknown): boolean;
+export interface PillFilter {
+    /**
+     * Predicate of the filter, or `timePreset` for the time range.
+     * Used as react key and to know what to reset when removing the pill.
+     */
+    id: string;
+    /** Filter group label, e.g. `Payment status`. */
+    label: string;
+    /**
+     * Formatted value(s), e.g. `Paid, Authorized`.
+     * `undefined` when it has to be resolved by fetching the resource, see `fetch`.
+     */
+    value?: string;
+    /**
+     * Set for filters backed by a resource (`inputResourceGroup`, `inputSelect`),
+     * whose labels live on the resources themselves and have to be retrieved.
+     */
+    fetch?: {
+        resource: ListableResourceType;
+        ids: string[];
+        fieldForLabel: string;
+        fieldForValue: string;
+    };
+    /** Which reset strategy the remove button has to apply. */
+    kind: "group" | "timeRange";
+}
+/**
+ * Reads the url query string and returns one descriptor per active filter, ready
+ * to be rendered as a pill.
+ *
+ * Filters matching `defaultValues` are omitted: on a page where the current view
+ * (e.g. a tab) already implies a set of filters, only the user's additions are
+ * worth showing as removable pills.
+ *
+ * The free text filter is always omitted, since it is already visible in the
+ * search bar, and so are hidden filters and `viewTitle`.
+ */
+export declare function getPillFilters({ instructions, queryString, predicateWhitelist, defaultValues, timezone, locale, }: {
+    instructions: FiltersInstructions;
+    queryString: string;
+    predicateWhitelist: string[];
+    defaultValues?: FormFullValues;
+    timezone?: string;
+    locale?: Parameters<typeof formatDateRange>[0]["locale"];
+}): PillFilter[];
+/**
+ * Form values to apply when clearing all the filters at once.
+ *
+ * Hidden filters, `viewTitle` and the free text search are preserved — they are
+ * not represented as pills, so wiping them would be an invisible side effect.
+ * Everything else goes back to `defaultValues` (empty when not provided).
+ */
+export declare function getClearedFormValues({ instructions, queryString, predicateWhitelist, defaultValues, }: {
+    instructions: FiltersInstructions;
+    queryString: string;
+    predicateWhitelist: string[];
+    defaultValues?: FormFullValues;
+}): FormFullValues;

package/dist/ui/resources/useResourceFilters/activeFilters.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ui/resources/useResourceFilters/types.d.ts

@@ -138,6 +138,47 @@ export type FilterItemOptions = BaseFilterItem & {
          * props required for the UI component
          */
         props: Omit<InputResourceGroupProps, "onChange" | "defaultValues" | "title">;
+    } | {
+        /**
+         * UI component to render: a select dropdown, matching the style of the
+         * dashboard metrics filters. Prefer it over `inputResourceGroup` when the
+         * options are many, since it searches server-side instead of showing a
+         * checkbox list with a "see all" overlay.
+         */
+        component: "inputSelect";
+        /**
+         * props required for the UI component.
+         *
+         * Either a fixed list of `options` — statuses, kinds, anything the app
+         * already knows — or a `resource` the options are fetched from.
+         */
+        props: ({
+            /**
+             * The options to choose from. An option can be hidden from the UI
+             * and still be accepted in the query, e.g. a status that is only
+             * ever set through a predefined link.
+             */
+            options: Array<{
+                label: string;
+                value: string;
+                isHidden?: boolean;
+            }>;
+        } | (Pick<InputResourceGroupProps, "resource" | "fieldForLabel" | "fieldForValue" | "searchBy" | "sortBy" | "filters" | "hideWhenSingleItem"> & {
+            /**
+             * How many options to load upfront. Capped at 25 by the Core API, which
+             * is why `searchBy` should be set when more options exist.
+             * @default 25
+             */
+            limit?: number;
+        })) & {
+            placeholder?: string;
+            isClearable?: boolean;
+            /**
+             * Filter predicates are usually `_in`, so multiple values are expected.
+             * @default true
+             */
+            isMulti?: boolean;
+        };
     };
 };
 export interface FilterItemTextSearch extends Omit<BaseFilterItem, "sdk"> {
@@ -186,6 +227,15 @@ export type FiltersInstructionItem = FilterItemOptions | FilterItemTextSearch |
 export type FiltersInstructions = FiltersInstructionItem[];
 export declare function isItemOptions(item: FiltersInstructionItem): item is FilterItemOptions;
 export declare function isTextSearch(item: FiltersInstructionItem): item is FilterItemTextSearch;
+/**
+ * The predicate of the free text filter shown in the search bar, if any.
+ *
+ * Not simply the first `textSearch` instruction: apps also declare `textSearch`
+ * items for predicates they only want whitelisted (hidden ones driving tabs, for
+ * instance), and those can come first. There is at most one `searchBar` in a set
+ * of instructions, so this is unambiguous.
+ */
+export declare function getSearchBarPredicate(instructions: FiltersInstructions): string | undefined;
 export declare function isCurrencyRange(item: FiltersInstructionItem): item is FilterItemCurrencyRange;
 export declare function isGroupedPredicates(item: FiltersInstructionItem): item is FilterItemGroupedPredicates;
 /**

package/dist/ui/resources/useResourceFilters/useResourceFilters.d.ts

@@ -1,7 +1,11 @@
 import { ListableResourceType, QueryFilter } from '@commercelayer/sdk';
+import { SearchBarProps } from '../../composite/SearchBar';
 import { UseResourceListConfig } from '../useResourceList';
 import { ResourceListProps } from '../useResourceList/useResourceList';
+import { ResourceTableProps, UseResourceTableConfig } from '../useResourceTable/types';
 import { makeFilterAdapters } from './adapters';
+import { FiltersBarProps } from './FiltersBar';
+import { FiltersDrawerProps } from './FiltersDrawer';
 import { FiltersFormProps } from './FiltersForm';
 import { FiltersNavProps } from './FiltersNav';
 import { FiltersInstructions } from './types';
@@ -29,8 +33,34 @@ interface UseResourceFiltersHook {
      * Helper methods to transform filters from/to url query string, sdk and form values
      */
     adapters: ReturnType<typeof makeFilterAdapters>;
+    /**
+     * Search bar with the filters button on the right and the applied filters
+     * rendered as removable pills below.
+     *
+     * Clicking the filters button opens the drawer rendered by `FiltersDrawer`,
+     * unless an `onFilterClick` prop is provided.
+     *
+     * @example
+     * ```jsx
+     * const { FiltersBar, FiltersDrawer, FilteredTable } = useResourceFilters({ instructions })
+     *
+     * <FiltersBar queryString={queryString} onUpdate={onUpdate} />
+     * <FilteredTable type='orders' columns={columns} />
+     * <FiltersDrawer onUpdate={onUpdate} />
+     * ```
+     */
+    FiltersBar: (props: FiltersBarProps) => React.ReactNode;
+    /**
+     * Side drawer with the filters form, opened by the `FiltersBar` filters button.
+     * Render it once per page as a sibling of `FiltersBar`.
+     */
+    FiltersDrawer: (props: FiltersDrawerProps) => React.ReactNode;
     /**
      * Search bar component with filters navigation buttons
+     *
+     * @deprecated Use `FiltersBar` together with `FiltersDrawer` instead, they
+     * render the search bar and the filters as pills in the style used by the
+     * dashboard. This component will be removed in a future major release.
      */
     SearchWithNav: (props: Pick<FiltersNavProps, "onFilterClick" | "queryString"> & {
         /**
@@ -44,6 +74,11 @@ interface UseResourceFiltersHook {
          * @default 'Search...'
          */
         searchBarPlaceholder?: string;
+        /**
+         * Visual variant of the search bar. Use `outline` to match the style used
+         * in the dashboard (metrics) pages.
+         */
+        searchBarVariant?: SearchBarProps["variant"];
         /**
          * Milliseconds to wait before triggering the search bar callback
          * @default 500
@@ -65,6 +100,19 @@ interface UseResourceFiltersHook {
         };
         hideTitle?: boolean;
     }) => React.ReactNode;
+    /**
+     * Filtered ResourceTable component based on current active filters.
+     * Table sibling of `FilteredList`: renders a column-model data table wired
+     * to the active search/filters and pagination.
+     */
+    FilteredTable: <TResource extends ListableResourceType>(props: Omit<UseResourceTableConfig<TResource>, "query" | "metricsQuery"> & ResourceTableProps & {
+        query?: Omit<NonNullable<UseResourceTableConfig<TResource>["query"]>, "filters">;
+        metricsQuery?: Omit<NonNullable<UseResourceTableConfig<TResource>["metricsQuery"]>, "filter"> & {
+            /** Filters need to be configured within the `useResourceFilters` options. */
+            filter?: never;
+        };
+        hideTitle?: boolean;
+    }) => React.ReactNode;
     /**
      * SDK filters object to be used in the sdk query
      */

package/dist/ui/resources/useResourceFilters/utils.d.ts

@@ -27,3 +27,13 @@ export declare function getActiveFilterCountFromUrl({ includeTextSearch, instruc
     queryString: string;
 }): number;
 export declare function getAllowedValuesFromItemOptions(instructionItem: FilterItemOptions): string[] | undefined;
+/**
+ * Whether an `options` filter holds a single value rather than a list.
+ *
+ * Two components can be single-valued and they say so differently: a toggle
+ * button through `mode`, a select through `isMulti`. Anything reading a filter
+ * value has to know which, so the value can be unwrapped from the array the URL
+ * always parses into — a predicate like `archived_at_null` expects `"hide"`,
+ * not `["hide"]`.
+ */
+export declare function isSingleValueOptionsItem(instructionItem: FilterItemOptions): boolean;

package/dist/ui/resources/useResourceList/adaptMetricsOrderToCore.d.ts

@@ -70,5 +70,10 @@ export interface MetricsResourceOrder {
         first_name?: string;
         last_name?: string;
     };
+    customer?: {
+        id?: string;
+        email?: string;
+        total_orders_count?: number;
+    };
 }
 export declare function adaptMetricsOrderToCore(metricsOrder: MetricsResourceOrder): Order;

package/dist/ui/resources/useResourceList/index.d.ts

@@ -1 +1,2 @@
+export { refreshResourceLists, removeFromResourceLists, } from './resourceListSignals';
 export { type ResourceListItemTemplateProps, type ResourceListProps, type UseResourceListConfig, useResourceList, } from './useResourceList';

package/dist/ui/resources/useResourceList/listFetcher.d.ts

@@ -12,11 +12,17 @@ export interface FetcherResponse<TResource> {
         cursor?: string | null;
     };
 }
-export declare function listFetcher<TResource extends ListableResourceType>({ currentData, resourceType, client, clientType, query, mode, pageNumber, }: {
+export declare function listFetcher<TResource extends ListableResourceType>({ currentData, resourceType, client, clientType, query, mode, pageNumber, cursor, }: {
     currentData?: FetcherResponse<Resource<TResource>>;
     resourceType: TResource;
     mode?: "infinite" | "pagination";
     pageNumber?: number;
+    /**
+     * Metrics API only: the cursor that opens the requested page. Used in
+     * `pagination` mode, where the caller keeps track of one cursor per page
+     * (the metrics API can only move forward on its own).
+     */
+    cursor?: string | null;
 } & ({
     client: CommerceLayerBundle;
     clientType: "coreSdkClient";

package/dist/ui/resources/useResourceList/resourceListSignals.d.ts

@@ -0,0 +1,46 @@
+import { ListableResourceType } from '@commercelayer/sdk';
+/**
+ * What a mounted list is being asked to do.
+ * - `removeItem` drops a single row without any request
+ * - `refresh` refetches from the first page
+ */
+type ResourceListSignal = {
+    kind: "removeItem";
+    resourceId: string;
+} | {
+    kind: "refresh";
+};
+type ResourceListSubscriber = (signal: ResourceListSignal) => void;
+/**
+ * Subscribe a mounted list to the signals for a resource type.
+ * Called by `useResourceList`; returns the unsubscribe function.
+ */
+export declare function subscribeToResourceLists(type: ListableResourceType, subscriber: ResourceListSubscriber): () => void;
+/**
+ * Drop a row from every mounted list of the given resource type, with no
+ * request. Call it right after a successful delete.
+ *
+ * Needed when the component that deletes is not the one rendering the list —
+ * typically a details drawer rendered as a sibling of the list, which leaves the
+ * list mounted, so it would otherwise keep showing the deleted row until the
+ * page is reloaded. Lists that do not hold the row ignore the signal, and the
+ * total record count is adjusted for those that do.
+ *
+ * @example
+ * await sdkClient.stock_items.delete(stockItem.id)
+ * removeFromResourceLists("stock_items", stockItem.id)
+ */
+export declare function removeFromResourceLists(type: ListableResourceType, resourceId: string): void;
+/**
+ * Refetch every mounted list of the given resource type from the first page.
+ *
+ * Prefer `removeFromResourceLists` after a delete: it is instant, and it neither
+ * flashes the loading skeleton nor renumbers an infinite list mid-scroll. Reach
+ * for this one when rows were created or edited elsewhere and the list content
+ * can no longer be patched locally.
+ *
+ * A signal emitted while no list is mounted is a no-op — which is harmless,
+ * since a list fetches on mount anyway.
+ */
+export declare function refreshResourceLists(type: ListableResourceType): void;
+export {};

package/dist/ui/resources/useResourceList/resourceListSignals.integration.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ui/resources/useResourceList/resourceListSignals.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ui/resources/useResourceList/useResourceList.d.ts

@@ -79,7 +79,9 @@ export type UseResourceListConfig<TResource extends ListableResourceType> = {
     preProcess?: (list: Array<Resource<TResource>>) => Array<Resource<TResource>>;
     /**
      * Pagination type: 'infinite' for infinite scrolling (default), 'pagination' for classic prev/next pagination.
-     * Note: 'pagination' mode is only supported for Core API (not Metrics API).
+     * Works with both the Core API and the Metrics API. Since the Metrics API is
+     * cursor-based, prev/next works by remembering the cursor that opens each
+     * visited page; arbitrary page jumps are not possible there.
      */
     paginationType?: "infinite" | "pagination";
     /**

package/dist/ui/resources/useResourceTable/index.d.ts

@@ -0,0 +1,2 @@
+export type { ResourceTableColumn, ResourceTableProps, ResourceTableSort, UseResourceTableConfig, UseResourceTableReturn, } from './types';
+export { useResourceTable } from './useResourceTable';