@commercelayer/app-elements 1.17.2 → 1.17.3

package/dist/main.js

@@ -1,5 +1,5 @@
 "use client";
-import { a4 as s, aK as t, a5 as o, a6 as r, a7 as n, a8 as u, a9 as i, aa as l, ab as p, ac as b, ad as c, aL as d, ae as g, af as S, V as m, aM as I, aN as k, aO as T, aP as D, ag as R, Z as y, _ as h, ah as C, ai as H, aQ as P, b0 as A, b1 as f, b3 as B, b5 as F, b7 as v, bb as L, bd as N, bi as O, bl as G, bn as w, bu as V, bw as x, by as E, bA as M, bC as W, bG as J, bH as U, aj as Y, ak as q, b2 as z, b4 as K, b6 as Q, b8 as Z, ba as _, bc as $, be as j, bf as X, bg as aa, bh as ea, bj as sa, bk as ta, bm as oa, bo as ra, bv as na, bx as ua, bz as ia, bB as la, bD as pa, bE as ba, bF as ca, aR as da, aS as ga, aT as Sa, aU as ma, a0 as Ia, aV as ka, al as Ta, aW as Da, aX as Ra, am as ya, an as ha, ao as Ca, ap as Ha, aY as Pa, bK as Aa, bL as fa, bM as Ba, bN as Fa, bO as va, bP as La, bQ as Na, bR as Oa, aq as Ga, aZ as wa, ar as Va, as as xa, at as Ea, au as Ma, aw as Wa, ax as Ja, ay as Ua, az as Ya, aA as qa, aF as za, aB as Ka, a_ as Qa, aG as Za, aH as _a, aC as $a, aI as ja, aD as Xa, a$ as ae, a1 as ee, aJ as se, aE as te, B as oe, a3 as re, E as ne, F as ue, k as ie, A as le, bp as pe, b9 as be, l as ce, m as de, q as ge, C as Se, D as me, G as Ie, bT as ke, bU as Te, bq as De, s as Re, t as ye, u as he, v as Ce, bV as He, bW as Pe, bX as Ae, bY as fe, bZ as Be, H as Fe, J as ve, b_ as Le, b$ as Ne, c0 as Oe, c1 as Ge, K as we, L as Ve, c2 as xe, c3 as Ee, c4 as Me, O as We, P as Je, e as Ue, M as Ye, N as qe, h as ze, br as Ke, bs as Qe, bt as Ze, n as _e, r as $e, x as je, bI as Xe, y as as, z as es, Q as ss, W as ts, Y as os, R as rs, S as ns, T as us, U as is, bS as ls, $ as ps, a2 as bs, bJ as cs, av as ds } from "./main-bvrBIWhO.js";
+import { a4 as s, aK as t, a5 as o, a6 as r, a7 as n, a8 as u, a9 as i, aa as l, ab as p, ac as b, ad as c, aL as d, ae as g, af as S, V as m, aM as I, aN as k, aO as T, aP as D, ag as R, Z as y, _ as h, ah as C, ai as H, aQ as P, b0 as A, b1 as f, b3 as B, b5 as F, b7 as v, bb as L, bd as N, bi as O, bl as G, bn as w, bu as V, bw as x, by as E, bA as M, bC as W, bG as J, bH as U, aj as Y, ak as q, b2 as z, b4 as K, b6 as Q, b8 as Z, ba as _, bc as $, be as j, bf as X, bg as aa, bh as ea, bj as sa, bk as ta, bm as oa, bo as ra, bv as na, bx as ua, bz as ia, bB as la, bD as pa, bE as ba, bF as ca, aR as da, aS as ga, aT as Sa, aU as ma, a0 as Ia, aV as ka, al as Ta, aW as Da, aX as Ra, am as ya, an as ha, ao as Ca, ap as Ha, aY as Pa, bK as Aa, bL as fa, bM as Ba, bN as Fa, bO as va, bP as La, bQ as Na, bR as Oa, aq as Ga, aZ as wa, ar as Va, as as xa, at as Ea, au as Ma, aw as Wa, ax as Ja, ay as Ua, az as Ya, aA as qa, aF as za, aB as Ka, a_ as Qa, aG as Za, aH as _a, aC as $a, aI as ja, aD as Xa, a$ as ae, a1 as ee, aJ as se, aE as te, B as oe, a3 as re, E as ne, F as ue, k as ie, A as le, bp as pe, b9 as be, l as ce, m as de, q as ge, C as Se, D as me, G as Ie, bT as ke, bU as Te, bq as De, s as Re, t as ye, u as he, v as Ce, bV as He, bW as Pe, bX as Ae, bY as fe, bZ as Be, H as Fe, J as ve, b_ as Le, b$ as Ne, c0 as Oe, c1 as Ge, K as we, L as Ve, c2 as xe, c3 as Ee, c4 as Me, O as We, P as Je, e as Ue, M as Ye, N as qe, h as ze, br as Ke, bs as Qe, bt as Ze, n as _e, r as $e, x as je, bI as Xe, y as as, z as es, Q as ss, W as ts, Y as os, R as rs, S as ns, T as us, U as is, bS as ls, $ as ps, a2 as bs, bJ as cs, av as ds } from "./main-qlfa6IYj.js";
 export {
   s as A,
   t as ActionButtons,

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

@@ -34,6 +34,18 @@ export type ResourceListProps<TResource extends ListableResourceType> = Pick<Sec
      * SDK query object to be used to fetch the list, excluding the pageNumber that is handled internally for infinite scrolling.
      */
     query?: Omit<QueryParamsList, 'pageNumber'>;
+    /**
+     * When set the component will fetch data from the Metrics API, and automatically use the returned cursor for infinite scrolling.
+     */
+    metricsQuery?: {
+        search: {
+            limit?: number;
+            sort?: 'asc' | 'desc';
+            sort_by?: string;
+            fields?: string[];
+        };
+        filter: Record<string, unknown>;
+    };
     /**
      * An element to be rendered when the list is empty.
      */
@@ -58,7 +70,7 @@ export type ResourceListProps<TResource extends ListableResourceType> = Pick<Sec
  * It's possible to specify a query to filter the list and either
  * a React component (`ItemTemplate`) to be used as item template for the list or a function as `children` to render a custom element.
  */
-export declare function ResourceList<TResource extends ListableResourceType>({ type, query, title, actionButton, emptyState, ...props }: ResourceListProps<TResource>): JSX.Element;
+export declare function ResourceList<TResource extends ListableResourceType>({ type, query, title, actionButton, emptyState, metricsQuery, ...props }: ResourceListProps<TResource>): JSX.Element;
 export declare namespace ResourceList {
     var displayName: string;
 }

package/dist/ui/resources/ResourceList/infiniteFetcher.d.ts

@@ -1,3 +1,4 @@
+import { type MetricsApiClient } from './metricsApiClient';
 import type { CommerceLayerClient, QueryParamsList } from '@commercelayer/sdk';
 import { type ListableResourceType } from '@commercelayer/sdk/lib/cjs/api';
 type ListResource<TResource extends ListableResourceType> = Awaited<ReturnType<CommerceLayerClient[TResource]['list']>>;
@@ -9,12 +10,19 @@ export interface FetcherResponse<TResource> {
         recordCount: number;
         currentPage: number;
         recordsPerPage: number;
+        cursor?: string | null;
     };
 }
-export declare function infiniteFetcher<TResource extends ListableResourceType>({ sdkClient, query, currentData, resourceType }: {
-    sdkClient: CommerceLayerClient;
-    query?: Omit<QueryParamsList, 'pageNumber'>;
+export declare function infiniteFetcher<TResource extends ListableResourceType>({ currentData, resourceType, client, clientType, query }: {
     currentData?: FetcherResponse<Resource<TResource>>;
     resourceType: TResource;
-}): Promise<FetcherResponse<Resource<TResource>>>;
+} & ({
+    client: CommerceLayerClient;
+    clientType: 'coreSdkClient';
+    query?: Omit<QueryParamsList, 'pageNumber'>;
+} | {
+    client: MetricsApiClient;
+    clientType: 'metricsClient';
+    query: Record<string, Record<string, unknown>>;
+})): Promise<FetcherResponse<Resource<TResource>>>;
 export {};

package/dist/ui/resources/ResourceList/metricsApiClient.d.ts

@@ -0,0 +1,21 @@
+import { type Resource } from './infiniteFetcher';
+import { type ListableResourceType } from '@commercelayer/sdk/lib/cjs/api';
+import { type ListMeta, type ListResponse } from '@commercelayer/sdk/lib/cjs/resource';
+import { type Writable } from 'type-fest';
+export type MetricsResources = 'orders' | 'returns';
+type ListResponseWithoutMeta<ResourceType extends MetricsResources> = Omit<ListResponse<Resource<ResourceType>>, 'meta'>;
+type ListMetaWithCursor = Writable<ListMeta> & {
+    cursor: string | null;
+};
+type ListResponseMetrics<ResourceType extends MetricsResources> = ListResponseWithoutMeta<ResourceType> & {
+    meta: ListMetaWithCursor;
+};
+type MetricsList = <Resource extends MetricsResources>(resourceType: Resource, query: Record<string, unknown>) => Promise<ListResponseMetrics<Resource>>;
+export interface MetricsApiClient {
+    list: MetricsList;
+}
+export declare function useMetricsSdkProvider(): {
+    metricsClient: MetricsApiClient;
+};
+export declare function isValidMetricsResource(resourceType: ListableResourceType): resourceType is MetricsResources;
+export {};

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

@@ -0,0 +1,32 @@
+import { type FiltersInstructions } from './types';
+import { type ListableResourceType } from '@commercelayer/sdk/lib/cjs/api';
+import { type QueryFilter } from '@commercelayer/sdk/lib/cjs/query';
+export type CoreResourceEnabledInMetrics = 'orders' | 'returns';
+type MetricsResource = 'order' | 'return';
+/** Record of core api filter operators with relative metrics operator */
+declare const metricsFiltersMapping: {
+    readonly _eq: "eq";
+    readonly _not_eq: "ne";
+    readonly _lt: "lt";
+    readonly _lteq: "lte";
+    readonly _gt: "gt";
+    readonly _gteq: "gte";
+    readonly _in: "in";
+    readonly _not_in: "not_in";
+};
+type CoreFilterOperator = keyof typeof metricsFiltersMapping;
+type MetricsFilterOperator = (typeof metricsFiltersMapping)[CoreFilterOperator];
+type MetricsAttribute = string;
+export type MetricsFilters = Partial<Record<MetricsResource, Record<MetricsAttribute, Partial<Record<MetricsFilterOperator, string | string[] | boolean>>> & {
+    date_from: string;
+    date_to: string;
+    date_field: string;
+}>>;
+export interface AdaptSdkToMetricsParams {
+    sdkFilters: QueryFilter;
+    resourceType: ListableResourceType;
+    instructions: FiltersInstructions;
+    predicateWhitelist?: string[];
+}
+export declare function adaptSdkToMetrics({ sdkFilters, resourceType, instructions, predicateWhitelist }: AdaptSdkToMetricsParams): MetricsFilters;
+export {};

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

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

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

@@ -1,3 +1,4 @@
+import { type AdaptSdkToMetricsParams, type MetricsFilters } from './adaptSdkToMetrics';
 import { type QueryFilter } from '@commercelayer/sdk/lib/cjs/query';
 import { type AdaptFormValuesToSdkParams } from './adaptFormValuesToSdk';
 import { type AdaptFormValuesToUrlQueryParams } from './adaptFormValuesToUrlQuery';
@@ -15,6 +16,7 @@ interface MakeFilterAdaptersReturn<FilterFormValues extends FormFullValues> {
     adaptUrlQueryToFormValues: (params: Pick<AdaptUrlQueryToFormValuesParams, 'queryString'>) => FilterFormValues & TimeRangeFormValues & PageInfoFormValues;
     adaptUrlQueryToSdk: (params: Pick<AdaptUrlQueryToSdkParams, 'queryString' | 'timezone'>) => QueryFilter;
     adaptUrlQueryToUrlQuery: (params: Pick<AdaptUrlQueryToUrlQueryParams, 'queryString'>) => string;
+    adaptSdkToMetrics: (params: Pick<AdaptSdkToMetricsParams, 'sdkFilters' | 'resourceType'>) => MetricsFilters;
     validInstructions: FiltersInstructions;
 }
 export type MakeFiltersAdapters = <FilterFormValues extends Record<UiFilterName, UiFilterValue>>({ instructions, predicateWhitelist }: MakeFilterAdaptersParams) => MakeFilterAdaptersReturn<FilterFormValues>;

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

@@ -60,7 +60,8 @@ interface UseResourceFiltersHook {
      * Filtered ResourceList component based on current active filters
      */
     FilteredList: <TResource extends ListableResourceType>(props: Pick<ResourceListProps<TResource>, 'type' | 'emptyState' | 'actionButton'> & ResourceListItemTemplate<TResource> & {
-        query?: Omit<NonNullable<ResourceListProps<TResource>['query']>, 'filters'> & {
+        query?: Omit<NonNullable<ResourceListProps<TResource>['query']>, 'filters'>;
+        metricsQuery?: Omit<NonNullable<ResourceListProps<TResource>['metricsQuery']>, 'filter'> & {
             /** Filters need to be configured within the `useResourceFilters` options. */
             filters?: never;
         };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/app-elements",
-  "version": "1.17.2",
+  "version": "1.17.3",
   "type": "module",
   "license": "MIT",
   "files": [
@@ -35,6 +35,7 @@
     "classnames": "^2.5.1",
     "jwt-decode": "^4.0.0",
     "lodash": "^4.17.21",
+    "pluralize": "^8.0.0",
     "query-string": "^8.2.0",
     "react": "^18.2.0",
     "react-currency-input-field": "^3.7.0",
@@ -56,6 +57,7 @@
     "@testing-library/jest-dom": "^6.4.2",
     "@testing-library/react": "^14.2.1",
     "@types/node": "^20.11.19",
+    "@types/pluralize": "^0.0.33",
     "@types/react-gtm-module": "^2.0.3",
     "@types/testing-library__jest-dom": "^5.14.9",
     "@vitejs/plugin-react": "^4.2.1",