@propeller-commerce/propeller-v2-react-ui 0.4.15 → 0.4.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +37 -0
- package/dist/index.cjs +59 -20
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +160 -63
- package/dist/index.d.ts +160 -63
- package/dist/index.js +59 -20
- package/dist/index.js.map +1 -1
- package/dist/pure.cjs.map +1 -1
- package/dist/pure.d.cts +2 -2
- package/dist/pure.d.ts +2 -2
- package/dist/pure.js.map +1 -1
- package/dist/shared.d.cts +1 -1
- package/dist/shared.d.ts +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -6,10 +6,10 @@ import React__default, { ReactNode, ComponentType } from 'react';
|
|
|
6
6
|
import { GraphQLClient, Contact, Customer, Cart, CartMainItem, Product, Cluster, AddressType, Gender, YesNo, Address, TransformationsInput, MediaImageProductSearchInput, CartProcessResponse, Crossupsell, CartUpdateAddressInput, CartUpdateInput, CartAddressType, ClusterConfig, Company, CompanyVariables, PurchaseAuthorizationConfigCreateInput, PurchaseAuthorizationConfigUpdateInput, FavoriteList, DateSearchInput, DecimalSearchInput, OrderSortInput, OrderType, OrderSearchFields, Order, ProductTextFilterInput, AttributeFilter, ProductsResponse, Category, CrossupsellType, AttributeResult, RegisterContactInput as RegisterContactInput$1, PurchaseAuthorizationConfig, CartChildItemInput, CartAddress, WarehouseAddress, OrderAddress, CartBaseItem, CartCarrier, CartPaymethod, ClusterOption, ProductInventory, OrderItem, ProductPrice, Bundle, PaginatedMediaDocumentResponse, PaginatedMediaVideoResponse } from '@propeller-commerce/propeller-sdk-v2';
|
|
7
7
|
|
|
8
8
|
/**
|
|
9
|
-
* Tier 1
|
|
9
|
+
* Tier 1 — application-wide infrastructure. Bound by `<PropellerDepsProvider>`
|
|
10
10
|
* once at the root of the app. These values are app-singletons: the GraphQL
|
|
11
11
|
* client, the SDK Services bundle wired to it, and the cosmetic / branding
|
|
12
|
-
* defaults (currency, configuration). They do not change per subtree
|
|
12
|
+
* defaults (currency, configuration). They do not change per subtree — for
|
|
13
13
|
* per-scope state (user, companyId, language) use `<PropellerProvider>`.
|
|
14
14
|
*
|
|
15
15
|
* Why split: per-scope state belongs to a routed section (impersonation,
|
|
@@ -20,7 +20,7 @@ import { GraphQLClient, Contact, Customer, Cart, CartMainItem, Product, Cluster,
|
|
|
20
20
|
interface PropellerDeps {
|
|
21
21
|
/**
|
|
22
22
|
* The GraphQL client the consumer constructed. Exposed for code that needs
|
|
23
|
-
* to pass it back into SDK helpers (rare
|
|
23
|
+
* to pass it back into SDK helpers (rare — most code should use `services`).
|
|
24
24
|
*/
|
|
25
25
|
graphqlClient: GraphQLClient;
|
|
26
26
|
/**
|
|
@@ -28,13 +28,13 @@ interface PropellerDeps {
|
|
|
28
28
|
* `graphqlClient`. Build it via `createServices(graphqlClient)`.
|
|
29
29
|
*/
|
|
30
30
|
services: Services;
|
|
31
|
-
/** Currency symbol used by display components. Default: `'
|
|
31
|
+
/** Currency symbol used by display components. Default: `'€'`. */
|
|
32
32
|
currency: string;
|
|
33
33
|
/** Free-form configuration bag forwarded to components. */
|
|
34
34
|
configuration: unknown;
|
|
35
35
|
}
|
|
36
36
|
/**
|
|
37
|
-
* Tier 2
|
|
37
|
+
* Tier 2 — per-scope state. Bound by `<PropellerProvider>` and replaceable
|
|
38
38
|
* by nesting a second provider deeper in the tree.
|
|
39
39
|
*/
|
|
40
40
|
interface PropellerScope {
|
|
@@ -52,7 +52,7 @@ interface PropellerScope {
|
|
|
52
52
|
* Shop mode declared in `propeller.json`. Combined with `user` to derive
|
|
53
53
|
* `userMode` on the composite context. Defaults to `'hybrid'` when omitted
|
|
54
54
|
* so existing call sites keep their current branching semantics (any
|
|
55
|
-
* logged-in Contact
|
|
55
|
+
* logged-in Contact → b2b surface).
|
|
56
56
|
*/
|
|
57
57
|
shopMode?: ShopMode;
|
|
58
58
|
}
|
|
@@ -87,7 +87,7 @@ interface PropellerDepsProviderProps {
|
|
|
87
87
|
*
|
|
88
88
|
* export function Providers({ children }) {
|
|
89
89
|
* return (
|
|
90
|
-
* <PropellerDepsProvider value={{ graphqlClient, services, currency: '
|
|
90
|
+
* <PropellerDepsProvider value={{ graphqlClient, services, currency: '€', configuration }}>
|
|
91
91
|
* <PropellerProvider value={scopeFromHostStores}>
|
|
92
92
|
* {children}
|
|
93
93
|
* </PropellerProvider>
|
|
@@ -105,7 +105,7 @@ interface PropellerProviderProps {
|
|
|
105
105
|
/**
|
|
106
106
|
* Provider for Tier 2 per-scope state (user, companyId, language,
|
|
107
107
|
* includeTax, portalMode). Wrap the routed tree; nest deeper to override
|
|
108
|
-
* scope for a subtree (impersonation, multi-cart,
|
|
108
|
+
* scope for a subtree (impersonation, multi-cart, …).
|
|
109
109
|
*/
|
|
110
110
|
declare function PropellerProvider({ value, children }: PropellerProviderProps): React$1.JSX.Element;
|
|
111
111
|
/**
|
|
@@ -113,7 +113,7 @@ declare function PropellerProvider({ value, children }: PropellerProviderProps):
|
|
|
113
113
|
* components stay usable standalone / in tests.
|
|
114
114
|
*/
|
|
115
115
|
declare function usePropellerDeps(): PropellerDeps | null;
|
|
116
|
-
/** Throwing variant
|
|
116
|
+
/** Throwing variant — call when deps are required. */
|
|
117
117
|
declare function useRequiredPropellerDeps(): PropellerDeps;
|
|
118
118
|
/**
|
|
119
119
|
* Read the Tier 2 scope. Returns `null` outside the provider so components
|
|
@@ -219,9 +219,16 @@ interface ProductGridConfig {
|
|
|
219
219
|
clusterCardComponent?: ComponentType<{
|
|
220
220
|
cluster: Cluster;
|
|
221
221
|
} & Record<string, unknown>>;
|
|
222
|
+
/**
|
|
223
|
+
* Render arbitrary content directly below each card's product name. Receives
|
|
224
|
+
* the product; return `null`/`undefined` to render nothing. Lets hosts surface
|
|
225
|
+
* extra per-product info (e.g. package descriptions) across the whole grid
|
|
226
|
+
* without swapping the entire card.
|
|
227
|
+
*/
|
|
228
|
+
belowName?: (product: Product) => ReactNode;
|
|
222
229
|
}
|
|
223
230
|
/**
|
|
224
|
-
* Provider
|
|
231
|
+
* Provider — ProductGrid wraps its card subtree with this so descendant
|
|
225
232
|
* cards read display flags and callbacks via {@link useProductGridConfig}
|
|
226
233
|
* instead of receiving them as threaded props.
|
|
227
234
|
*
|
|
@@ -1001,7 +1008,7 @@ type InfraKey$1 = keyof PropellerInfra;
|
|
|
1001
1008
|
declare function useInfraProps<P extends Partial<Record<InfraKey$1, unknown>>>(props: P): P & Partial<PropellerInfra>;
|
|
1002
1009
|
|
|
1003
1010
|
/**
|
|
1004
|
-
* useMenu (React)
|
|
1011
|
+
* useMenu (React) — Category tree fetch with depth-configurable recursive GraphQL query.
|
|
1005
1012
|
*
|
|
1006
1013
|
* Responsibilities:
|
|
1007
1014
|
* - Dynamic recursive GraphQL category query (depth-configurable, default 3)
|
|
@@ -1045,14 +1052,14 @@ interface UseMenuReturn {
|
|
|
1045
1052
|
clearCache: (rootCategoryId: number, language: string, userKey?: string) => void;
|
|
1046
1053
|
}
|
|
1047
1054
|
/**
|
|
1048
|
-
* useMenu
|
|
1055
|
+
* useMenu — category-tree fetch with a depth-configurable recursive GraphQL query.
|
|
1049
1056
|
*
|
|
1050
1057
|
* @param options - see {@link UseMenuOptions}.
|
|
1051
|
-
* @returns the category tree, loading/error state and fetch/cache actions
|
|
1058
|
+
* @returns the category tree, loading/error state and fetch/cache actions — see {@link UseMenuReturn}.
|
|
1052
1059
|
*
|
|
1053
1060
|
* @remarks
|
|
1054
1061
|
* GraphQL integration: unlike the SDK-service hooks, `fetchMenu` runs a raw query
|
|
1055
|
-
* directly via `graphqlClient.query()`
|
|
1062
|
+
* directly via `graphqlClient.query()` — it builds a recursive `categories { ... }`
|
|
1056
1063
|
* fragment to the configured `depth` and reads the root category's children.
|
|
1057
1064
|
* Results are cached in `localStorage` with a 12h TTL under a key scoped by root
|
|
1058
1065
|
* category, language and `userKey`. A module-level `inflightFetches` map dedups
|
|
@@ -1281,6 +1288,18 @@ interface UseProductInfoOptions {
|
|
|
1281
1288
|
user?: Contact | Customer | null;
|
|
1282
1289
|
/** Active company id for company-scoped pricing and orderlist resolution. */
|
|
1283
1290
|
companyId?: number;
|
|
1291
|
+
/**
|
|
1292
|
+
* Scope the product fetch to specific orderlist IDs (e.g. a chosen B2B
|
|
1293
|
+
* contract). When provided, these override the default behaviour of resolving
|
|
1294
|
+
* and applying ALL of the company's orderlists.
|
|
1295
|
+
*/
|
|
1296
|
+
orderlistIds?: number[];
|
|
1297
|
+
/**
|
|
1298
|
+
* Apply the orderlist filter. Defaults to `true` when `orderlistIds` is
|
|
1299
|
+
* non-empty (or resolved from the company), `false` when explicitly set so an
|
|
1300
|
+
* authenticated user without a contract sees the full catalogue.
|
|
1301
|
+
*/
|
|
1302
|
+
applyOrderlists?: boolean;
|
|
1284
1303
|
/** Attribute names to include in attributeResultSearchInput (productTrackAttributes). */
|
|
1285
1304
|
productTrackAttributes?: string[];
|
|
1286
1305
|
/** Portal configuration: image search/variant filters per size. */
|
|
@@ -1360,6 +1379,14 @@ interface UseProductSearchOptions {
|
|
|
1360
1379
|
user?: Contact | Customer | null;
|
|
1361
1380
|
/** Active company id for company-scoped pricing/visibility. */
|
|
1362
1381
|
companyId?: number;
|
|
1382
|
+
/** Scope the product fetch to specific orderlist IDs (e.g. a chosen B2B contract). */
|
|
1383
|
+
orderlistIds?: number[];
|
|
1384
|
+
/**
|
|
1385
|
+
* Apply the orderlist filter on the search input. Defaults to `true` when
|
|
1386
|
+
* `orderlistIds` is non-empty, `false` otherwise — so an authenticated user
|
|
1387
|
+
* without a contract still sees the full catalogue.
|
|
1388
|
+
*/
|
|
1389
|
+
applyOrderlists?: boolean;
|
|
1363
1390
|
/** Attribute text filters applied to the category search. */
|
|
1364
1391
|
textFilters?: ProductTextFilterInput[];
|
|
1365
1392
|
/** Lower price bound filter. */
|
|
@@ -1860,7 +1887,7 @@ declare function useResolvedProps<P extends object>(rawProps: P, spec: ResolveSp
|
|
|
1860
1887
|
declare function useServices(): Services;
|
|
1861
1888
|
|
|
1862
1889
|
/**
|
|
1863
|
-
* cartInit
|
|
1890
|
+
* cartInit — 3-step cart initialisation shared by useCart and useProductBundles.
|
|
1864
1891
|
*
|
|
1865
1892
|
* Step 1: Search for an existing OPEN cart for this user.
|
|
1866
1893
|
* Step 2: If none found, create a new cart via startCart.
|
|
@@ -1872,14 +1899,14 @@ declare function useServices(): Services;
|
|
|
1872
1899
|
/** Configuration object for {@link initCart}. */
|
|
1873
1900
|
interface CartInitConfig {
|
|
1874
1901
|
/**
|
|
1875
|
-
* The Services bundle
|
|
1902
|
+
* The Services bundle — pass `services` from `usePropellerContext()` / the
|
|
1876
1903
|
* provider's value object. Replaces the previous `graphqlClient` field
|
|
1877
1904
|
* which forced this util to know how to construct services.
|
|
1878
1905
|
*/
|
|
1879
1906
|
services: Services;
|
|
1880
1907
|
/** The current user (Contact or Customer); `null` for anonymous carts. */
|
|
1881
1908
|
user: AnyUser;
|
|
1882
|
-
/** Active company ID
|
|
1909
|
+
/** Active company ID — overrides user's default company for cart lookup and creation */
|
|
1883
1910
|
companyId?: number;
|
|
1884
1911
|
/** Language code for localised cart queries. Defaults to `'NL'`. */
|
|
1885
1912
|
language?: string;
|
|
@@ -1909,7 +1936,7 @@ interface CartInitConfig {
|
|
|
1909
1936
|
declare function initCart(config: CartInitConfig): Promise<Cart>;
|
|
1910
1937
|
|
|
1911
1938
|
/**
|
|
1912
|
-
* fetchActiveCart
|
|
1939
|
+
* fetchActiveCart — fetches the user's existing OPEN cart filtered by user/company.
|
|
1913
1940
|
*
|
|
1914
1941
|
* Framework-agnostic helper so login/register pages can reuse the same logic
|
|
1915
1942
|
* without forcing a state-management store dependency.
|
|
@@ -1918,13 +1945,13 @@ declare function initCart(config: CartInitConfig): Promise<Cart>;
|
|
|
1918
1945
|
/** Configuration object for {@link fetchActiveCart}. */
|
|
1919
1946
|
interface FetchActiveCartConfig {
|
|
1920
1947
|
/**
|
|
1921
|
-
* The Services bundle
|
|
1948
|
+
* The Services bundle — pass `services` from `usePropellerContext()` / the
|
|
1922
1949
|
* provider's value object. Replaces the previous `graphqlClient` field.
|
|
1923
1950
|
*/
|
|
1924
1951
|
services: Services;
|
|
1925
1952
|
/** The authenticated user (Contact or Customer) whose cart to look up. */
|
|
1926
1953
|
user: Contact | Customer;
|
|
1927
|
-
/** Active company ID
|
|
1954
|
+
/** Active company ID — narrows the cart search for company users. */
|
|
1928
1955
|
companyId?: number;
|
|
1929
1956
|
/** Language code for the localised cart query. */
|
|
1930
1957
|
language: string;
|
|
@@ -1948,7 +1975,7 @@ interface FetchActiveCartConfig {
|
|
|
1948
1975
|
declare function fetchActiveCart(cfg: FetchActiveCartConfig): Promise<Cart | null>;
|
|
1949
1976
|
|
|
1950
1977
|
/**
|
|
1951
|
-
* mergeAnonymousCart
|
|
1978
|
+
* mergeAnonymousCart — copies items from an anonymous cart into a target
|
|
1952
1979
|
* (authenticated) cart by calling CartService.addItemToCart per item.
|
|
1953
1980
|
*
|
|
1954
1981
|
* Framework-agnostic.
|
|
@@ -1957,7 +1984,7 @@ declare function fetchActiveCart(cfg: FetchActiveCartConfig): Promise<Cart | nul
|
|
|
1957
1984
|
/** Configuration object for {@link mergeAnonymousCart}. */
|
|
1958
1985
|
interface MergeAnonymousCartConfig {
|
|
1959
1986
|
/**
|
|
1960
|
-
* The Services bundle
|
|
1987
|
+
* The Services bundle — pass `services` from `usePropellerContext()` / the
|
|
1961
1988
|
* provider's value object. Replaces the previous `graphqlClient` field.
|
|
1962
1989
|
*/
|
|
1963
1990
|
services: Services;
|
|
@@ -3200,7 +3227,7 @@ interface CartSummaryProps {
|
|
|
3200
3227
|
declare function CartSummary(rawProps: CartSummaryProps): React$1.JSX.Element;
|
|
3201
3228
|
|
|
3202
3229
|
/**
|
|
3203
|
-
* @rsc-blocked
|
|
3230
|
+
* @rsc-blocked — Client-only component: interactive state (useState/useReducer).
|
|
3204
3231
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
3205
3232
|
* imported directly into a React Server Component. The 'use client' header
|
|
3206
3233
|
* above marks this boundary to Next.js.
|
|
@@ -3239,7 +3266,7 @@ interface CategoryDescriptionProps {
|
|
|
3239
3266
|
declare function CategoryDescription(props: CategoryDescriptionProps): React$1.JSX.Element;
|
|
3240
3267
|
|
|
3241
3268
|
/**
|
|
3242
|
-
* @rsc-safe
|
|
3269
|
+
* @rsc-safe — Pure display component. No React hooks, no event handlers, no
|
|
3243
3270
|
* browser APIs, no context reads. Renders directly from props and can be
|
|
3244
3271
|
* imported into a React Server Component without a 'use client' boundary.
|
|
3245
3272
|
* Verified C0.2 (2026-05-20).
|
|
@@ -3523,7 +3550,7 @@ interface ClusterConfiguratorProps {
|
|
|
3523
3550
|
declare function ClusterConfigurator(props: ClusterConfiguratorProps): React$1.JSX.Element;
|
|
3524
3551
|
|
|
3525
3552
|
/**
|
|
3526
|
-
* @rsc-blocked
|
|
3553
|
+
* @rsc-blocked — Client-only component: side effects (useEffect).
|
|
3527
3554
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
3528
3555
|
* imported directly into a React Server Component. The 'use client' header
|
|
3529
3556
|
* above marks this boundary to Next.js.
|
|
@@ -3548,7 +3575,7 @@ interface ClusterInfoProps {
|
|
|
3548
3575
|
*/
|
|
3549
3576
|
graphqlClient?: GraphQLClient;
|
|
3550
3577
|
/**
|
|
3551
|
-
* Called once the cluster data is loaded
|
|
3578
|
+
* Called once the cluster data is loaded — either immediately (when
|
|
3552
3579
|
* `cluster` prop is supplied) or after the internal fetch completes.
|
|
3553
3580
|
* Use this to hydrate sibling components (configurator, price, gallery, etc.).
|
|
3554
3581
|
*/
|
|
@@ -3656,7 +3683,7 @@ interface ClusterOptionsProps {
|
|
|
3656
3683
|
declare function ClusterOptions(props: ClusterOptionsProps): React$1.JSX.Element;
|
|
3657
3684
|
|
|
3658
3685
|
/**
|
|
3659
|
-
* @rsc-blocked
|
|
3686
|
+
* @rsc-blocked — Client-only component: browser-only APIs (window/document/storage).
|
|
3660
3687
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
3661
3688
|
* imported directly into a React Server Component. The 'use client' header
|
|
3662
3689
|
* above marks this boundary to Next.js.
|
|
@@ -3719,7 +3746,7 @@ interface DeliveryDateProps {
|
|
|
3719
3746
|
declare function DeliveryDate(props: DeliveryDateProps): React$1.JSX.Element;
|
|
3720
3747
|
|
|
3721
3748
|
/**
|
|
3722
|
-
* @rsc-blocked
|
|
3749
|
+
* @rsc-blocked — Client-only component: JSX event handlers (onClick/onChange/etc.).
|
|
3723
3750
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
3724
3751
|
* imported directly into a React Server Component. The 'use client' header
|
|
3725
3752
|
* above marks this boundary to Next.js.
|
|
@@ -3738,8 +3765,8 @@ interface GridPaginationProps {
|
|
|
3738
3765
|
onPageChange: (page: number) => void;
|
|
3739
3766
|
/**
|
|
3740
3767
|
* Pagination display variant.
|
|
3741
|
-
* 'compact'
|
|
3742
|
-
* 'full'
|
|
3768
|
+
* 'compact' — Previous / "Page X of Y" / Next.
|
|
3769
|
+
* 'full' — numbered page buttons with ellipsis collapsing + Previous / Next.
|
|
3743
3770
|
* Defaults to 'compact'.
|
|
3744
3771
|
*/
|
|
3745
3772
|
variant?: string;
|
|
@@ -4060,7 +4087,7 @@ interface FavoriteListsProps {
|
|
|
4060
4087
|
declare function FavoriteLists(rawProps: FavoriteListsProps): React$1.JSX.Element;
|
|
4061
4088
|
|
|
4062
4089
|
/**
|
|
4063
|
-
* @rsc-blocked
|
|
4090
|
+
* @rsc-blocked — Client-only component: interactive state (useState/useReducer).
|
|
4064
4091
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
4065
4092
|
* imported directly into a React Server Component. The 'use client' header
|
|
4066
4093
|
* above marks this boundary to Next.js.
|
|
@@ -4107,7 +4134,7 @@ interface ForgotPasswordProps {
|
|
|
4107
4134
|
declare function ForgotPassword(rawProps: ForgotPasswordProps): React$1.JSX.Element;
|
|
4108
4135
|
|
|
4109
4136
|
/**
|
|
4110
|
-
* @rsc-blocked
|
|
4137
|
+
* @rsc-blocked — Client-only component: interactive state (useState/useReducer).
|
|
4111
4138
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
4112
4139
|
* imported directly into a React Server Component. The 'use client' header
|
|
4113
4140
|
* above marks this boundary to Next.js.
|
|
@@ -4144,11 +4171,11 @@ interface GridFiltersProps {
|
|
|
4144
4171
|
/** Enable mobile-specific behaviour (drops sticky positioning). */
|
|
4145
4172
|
isMobile?: boolean;
|
|
4146
4173
|
/**
|
|
4147
|
-
* 'open'
|
|
4148
|
-
* 'semi-closed'
|
|
4174
|
+
* 'open' — show price filter for all users.
|
|
4175
|
+
* 'semi-closed' — hide price filter for unauthenticated users.
|
|
4149
4176
|
*/
|
|
4150
4177
|
portalMode?: string;
|
|
4151
|
-
/** Authenticated user
|
|
4178
|
+
/** Authenticated user — price filter visibility depends on this in semi-closed mode. */
|
|
4152
4179
|
user?: Contact | Customer | null;
|
|
4153
4180
|
/**
|
|
4154
4181
|
* Whether filter accordions start collapsed.
|
|
@@ -4261,6 +4288,11 @@ interface GridToolbarProps {
|
|
|
4261
4288
|
* Defaults to all available sort fields.
|
|
4262
4289
|
*/
|
|
4263
4290
|
sortOptions?: string[];
|
|
4291
|
+
/**
|
|
4292
|
+
* Hide the price-ascending/descending sort options entirely. Default: false.
|
|
4293
|
+
* Useful for closed B2B portals where prices are "by quotation".
|
|
4294
|
+
*/
|
|
4295
|
+
hidePriceSort?: boolean;
|
|
4264
4296
|
/**
|
|
4265
4297
|
* Active sort — first element is used.
|
|
4266
4298
|
* Defaults to [{ field: 'CATEGORY_ORDER', order: 'DESC' }].
|
|
@@ -4503,6 +4535,13 @@ interface MenuProps {
|
|
|
4503
4535
|
* Defaults to 'category/{categoryId}/{slug}'.
|
|
4504
4536
|
*/
|
|
4505
4537
|
menuLinkFormat?: string;
|
|
4538
|
+
/**
|
|
4539
|
+
* Custom URL builder for category links. Overrides `menuLinkFormat` /
|
|
4540
|
+
* `configuration.urls.getCategoryUrl`. Lets hosts inject dynamic query strings
|
|
4541
|
+
* (e.g. `?contract=…`) that a static format string cannot express.
|
|
4542
|
+
* Mirrors the `getUrl` prop on Breadcrumbs.
|
|
4543
|
+
*/
|
|
4544
|
+
getUrl?: (category: Category) => string;
|
|
4506
4545
|
/**
|
|
4507
4546
|
* Called when a menu item is clicked.
|
|
4508
4547
|
* Use for SPA-style routing instead of full-page navigation.
|
|
@@ -5161,6 +5200,14 @@ interface ProductCardProps {
|
|
|
5161
5200
|
badgesComponent?: React$1.ComponentType<_propeller_commerce_propeller_v2_core_ui.BadgesComponentProps>;
|
|
5162
5201
|
/** Replaces the default favorite-toggle. Receives `FavoriteComponentProps`. */
|
|
5163
5202
|
favoriteComponent?: React$1.ComponentType<_propeller_commerce_propeller_v2_core_ui.FavoriteComponentProps>;
|
|
5203
|
+
/**
|
|
5204
|
+
* Render arbitrary content directly below the product name (and above the
|
|
5205
|
+
* short description / price), in both the grid and row layouts. Receives the
|
|
5206
|
+
* product so hosts can surface extra info — e.g. package descriptions, custom
|
|
5207
|
+
* badges — without forking the card. Return `null`/`undefined` to render
|
|
5208
|
+
* nothing for a given product.
|
|
5209
|
+
*/
|
|
5210
|
+
belowName?: (product: Product) => React$1.ReactNode;
|
|
5164
5211
|
}
|
|
5165
5212
|
/**
|
|
5166
5213
|
* Root of the `<ProductCard>` compound component. Renders either the
|
|
@@ -5238,6 +5285,10 @@ declare function ProductCardStock(props: {
|
|
|
5238
5285
|
/** Show only the availability indicator. Defaults to context `showAvailability`. */
|
|
5239
5286
|
showAvailability?: boolean;
|
|
5240
5287
|
}): React$1.JSX.Element | null;
|
|
5288
|
+
/** Renders host-supplied content directly below the name, via the `belowName`
|
|
5289
|
+
* render prop (explicit or from grid context). Renders nothing when unset or
|
|
5290
|
+
* when the render prop returns a nullish value. */
|
|
5291
|
+
declare function ProductCardBelowName(): React$1.JSX.Element | null;
|
|
5241
5292
|
/** Renders the product price via the embedded `ProductPrice` component, or
|
|
5242
5293
|
* the injected `priceComponent` from context when set. */
|
|
5243
5294
|
declare function ProductCardPrice(props: {
|
|
@@ -5285,6 +5336,7 @@ type ProductCardComponent = typeof MemoizedRoot & {
|
|
|
5285
5336
|
Favorite: typeof ProductCardFavorite;
|
|
5286
5337
|
Name: typeof ProductCardName;
|
|
5287
5338
|
Sku: typeof ProductCardSku;
|
|
5339
|
+
BelowName: typeof ProductCardBelowName;
|
|
5288
5340
|
ShortDescription: typeof ProductCardShortDescription;
|
|
5289
5341
|
Manufacturer: typeof ProductCardManufacturer;
|
|
5290
5342
|
TextLabels: typeof ProductCardTextLabels;
|
|
@@ -5295,7 +5347,7 @@ type ProductCardComponent = typeof MemoizedRoot & {
|
|
|
5295
5347
|
declare const ProductCard: ProductCardComponent;
|
|
5296
5348
|
|
|
5297
5349
|
/**
|
|
5298
|
-
* @rsc-blocked
|
|
5350
|
+
* @rsc-blocked — Client-only component: interactive state (useState/useReducer).
|
|
5299
5351
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
5300
5352
|
* imported directly into a React Server Component. The 'use client' header
|
|
5301
5353
|
* above marks this boundary to Next.js.
|
|
@@ -5400,7 +5452,7 @@ declare function ProductGallery(props: ProductGalleryProps): React$1.JSX.Element
|
|
|
5400
5452
|
interface ProductGridProps {
|
|
5401
5453
|
/**
|
|
5402
5454
|
* Initialised Propeller SDK GraphQL client.
|
|
5403
|
-
* Required when `products` is not provided
|
|
5455
|
+
* Required when `products` is not provided — used for internal data fetching.
|
|
5404
5456
|
*/
|
|
5405
5457
|
graphqlClient?: GraphQLClient;
|
|
5406
5458
|
/**
|
|
@@ -5420,15 +5472,23 @@ interface ProductGridProps {
|
|
|
5420
5472
|
*/
|
|
5421
5473
|
categoryId?: number;
|
|
5422
5474
|
/**
|
|
5423
|
-
* Search term
|
|
5475
|
+
* Search term — passes `term` into categoryProductSearchInput and uses
|
|
5424
5476
|
* `config.baseCategoryId` so the whole catalog is searched.
|
|
5425
5477
|
*/
|
|
5426
5478
|
term?: string;
|
|
5427
5479
|
/**
|
|
5428
|
-
* Manufacturer/brand name
|
|
5480
|
+
* Manufacturer/brand name — passes `manufacturers: [brand]` into
|
|
5429
5481
|
* categoryProductSearchInput and uses `config.baseCategoryId`.
|
|
5430
5482
|
*/
|
|
5431
5483
|
brand?: string;
|
|
5484
|
+
/** Scope the product fetch to specific orderlist IDs (e.g. a chosen B2B contract). */
|
|
5485
|
+
orderlistIds?: number[];
|
|
5486
|
+
/**
|
|
5487
|
+
* Apply the orderlist filter. Defaults to `true` when `orderlistIds` is
|
|
5488
|
+
* non-empty, `false` otherwise — so an authenticated user without a contract
|
|
5489
|
+
* still sees the full catalogue.
|
|
5490
|
+
*/
|
|
5491
|
+
applyOrderlists?: boolean;
|
|
5432
5492
|
/** Number of columns in the grid. Accepts 2, 3, 4, 5, or 6. Defaults to 3. */
|
|
5433
5493
|
columns?: number;
|
|
5434
5494
|
/**
|
|
@@ -5450,8 +5510,8 @@ interface ProductGridProps {
|
|
|
5450
5510
|
renderClusterCard?: (cluster: Cluster) => any;
|
|
5451
5511
|
/**
|
|
5452
5512
|
* Controls portal visibility mode.
|
|
5453
|
-
* 'open'
|
|
5454
|
-
* 'semi-closed'
|
|
5513
|
+
* 'open' — full e-commerce; AddToCart is visible in product cards.
|
|
5514
|
+
* 'semi-closed' — catalog-only; AddToCart is hidden.
|
|
5455
5515
|
* Defaults to 'open'.
|
|
5456
5516
|
*/
|
|
5457
5517
|
portalMode?: string;
|
|
@@ -5462,16 +5522,16 @@ interface ProductGridProps {
|
|
|
5462
5522
|
/** * Enables stock validation inside AddToCart. * Blocks add when requested quantity exceeds available stock. * Defaults to false. */ stockValidation?: boolean;
|
|
5463
5523
|
/** * When false, hides the AddToCart control in product cards. * ClusterCards always show their "View cluster" navigation button. * Defaults to true. */ allowAddToCart?: boolean;
|
|
5464
5524
|
/** * Called after each internal data fetch with the filterable attributes * returned by the API (for driving a sibling FiltersSidebar). */ onFiltersChange?: (filters: AttributeFilter[]) => void;
|
|
5465
|
-
/** * Active text filters to apply
|
|
5525
|
+
/** * Active text filters to apply — built by the parent from FiltersSidebar * `onFilterChange` callbacks. Each entry maps to a `textFilters` input * row in the CategoryService query. * When this prop changes the grid automatically re-fetches (page resets to 1). */ textFilters?: ProductTextFilterInput[];
|
|
5466
5526
|
/** * Active price range lower bound from the FiltersSidebar `onPriceChange`. * Triggers a re-fetch when changed. */ priceFilterMin?: number;
|
|
5467
5527
|
/** * Active price range upper bound from the FiltersSidebar `onPriceChange`. * Triggers a re-fetch when changed. */ priceFilterMax?: number;
|
|
5468
5528
|
/** * Called when sort state changes internally (for syncing a sibling toolbar). */ onSortChange?: (field: string, order: string) => void;
|
|
5469
|
-
/** * Called after each internal data fetch with the min/max price of the * current product set
|
|
5470
|
-
/** * Called after each fetch with the total number of products found
|
|
5529
|
+
/** * Called after each internal data fetch with the min/max price of the * current product set — use to populate a price range slider in the parent. */ onPriceBoundsChange?: (min: number, max: number) => void;
|
|
5530
|
+
/** * Called after each fetch with the total number of products found — * use to display a result count in the parent toolbar. */ onItemsFoundChange?: (count: number) => void;
|
|
5471
5531
|
/** * Called after each fetch with the number of items visible on the current page * (after client-side language filtering). */ onPageItemCountChange?: (count: number) => void;
|
|
5472
|
-
/** * Called when the user clicks Previous / Next in the built-in pagination
|
|
5473
|
-
/** * Called after each successful internal data fetch with the full * ProductsResponse object
|
|
5474
|
-
/** * Called after each successful internal data fetch with the full * Category object
|
|
5532
|
+
/** * Called when the user clicks Previous / Next in the built-in pagination — * use to keep the parent URL / page state in sync. */ onPageChange?: (page: number) => void;
|
|
5533
|
+
/** * Called after each successful internal data fetch with the full * ProductsResponse object — use to drive an external GridPagination * component by passing the result as its `products` prop. */ onProductsResponse?: (products: ProductsResponse) => void;
|
|
5534
|
+
/** * Called after each successful internal data fetch with the full * Category object — use to populate sibling components like GridTitle, * CategoryDescription, and CategoryShortDescription. */ onCategoryChange?: (category: Category) => void;
|
|
5475
5535
|
/** * Called whenever the internal loading state changes. * Use to disable sibling components (e.g. GridFilters) while a fetch is in flight. */ onLoadingChange?: (isLoading: boolean) => void;
|
|
5476
5536
|
/** * Externally controlled current page. * When provided, the grid uses this value instead of its internal page * counter. Wire this to the `onPageChange` callback from a sibling * GridPagination so the two components stay in sync. * When changed the grid automatically re-fetches. */ page?: number;
|
|
5477
5537
|
/** * Number of products per page. Defaults to 12. * When changed the grid automatically re-fetches (page resets to 1). */ pageSize?: number;
|
|
@@ -5479,9 +5539,9 @@ interface ProductGridProps {
|
|
|
5479
5539
|
/** * Sort direction: 'ASC' or 'DESC'. * Only used when sortField is also provided. * When changed the grid automatically re-fetches (page resets to 1). */ sortOrder?: string;
|
|
5480
5540
|
/**
|
|
5481
5541
|
* Configuration object providing:
|
|
5482
|
-
* imageSearchFiltersGrid, imageVariantFiltersMedium
|
|
5483
|
-
* baseCategoryId
|
|
5484
|
-
* urls.getProductUrl / urls.getClusterUrl
|
|
5542
|
+
* imageSearchFiltersGrid, imageVariantFiltersMedium — passed to CategoryService
|
|
5543
|
+
* baseCategoryId — used when querying by term or brand
|
|
5544
|
+
* urls.getProductUrl / urls.getClusterUrl — for card URL generation
|
|
5485
5545
|
*/
|
|
5486
5546
|
configuration?: {
|
|
5487
5547
|
baseCategoryId?: number;
|
|
@@ -5497,7 +5557,7 @@ interface ProductGridProps {
|
|
|
5497
5557
|
/** Called after AddToCart creates a new cart internally. */ onCartCreated?: (cart: Cart) => void;
|
|
5498
5558
|
/** Called after every successful add-to-cart operation. */ afterAddToCart?: (cart: Cart, item?: CartMainItem) => void;
|
|
5499
5559
|
/** * When true, AddToCart shows a success modal instead of a toast. * Defaults to false. */ showModal?: boolean;
|
|
5500
|
-
/** * Render
|
|
5560
|
+
/** * Render − / + stepper buttons in AddToCart. * Defaults to true. */ allowIncrDecr?: boolean;
|
|
5501
5561
|
/** Called when "Proceed to checkout" is clicked in the AddToCart modal. */ onProceedToCheckout?: () => void;
|
|
5502
5562
|
/** Called when "Request a Quote" is clicked in the AddToCart modal. */ onRequestQuoteClick?: (cart: Cart) => void;
|
|
5503
5563
|
/** * Label overrides forwarded directly to the embedded AddToCart component. * Keys: add, adding, addedToCart, outOfStock, noCartId, errorAdding, * modalTitle, quantity, continueShopping, proceedToCheckout */ addToCartLabels?: Record<string, string>;
|
|
@@ -5516,8 +5576,8 @@ interface ProductGridProps {
|
|
|
5516
5576
|
clusterCardLabels?: Record<string, string>;
|
|
5517
5577
|
/** Show a heart-icon favourite toggle on each card. */ enableAddFavorite?: boolean;
|
|
5518
5578
|
/** * Called when a favourite is toggled on any card. * Receives the full Product or Cluster object and the new favourite state. */ onToggleFavorite?: (item: Product | Cluster, isFavorite: boolean) => void;
|
|
5519
|
-
/** * Called when a cluster card name, image, or "View cluster" button is * clicked
|
|
5520
|
-
/** * Called when a product card name or image is clicked
|
|
5579
|
+
/** * Called when a cluster card name, image, or "View cluster" button is * clicked — use for SPA-style routing instead of full-page navigation. */ onClusterClick?: (cluster: Cluster) => void;
|
|
5580
|
+
/** * Called when a product card name or image is clicked — use for SPA * routing instead of full-page navigation. */ onProductClick?: (product: Product) => void;
|
|
5521
5581
|
/** Extra CSS class applied to the root element. */ className?: string;
|
|
5522
5582
|
/**
|
|
5523
5583
|
* Compound API: when provided, the grid renders these children inside a
|
|
@@ -5543,6 +5603,14 @@ interface ProductGridProps {
|
|
|
5543
5603
|
favoriteComponent?: React$1.ComponentType<_propeller_commerce_propeller_v2_core_ui.FavoriteComponentProps>;
|
|
5544
5604
|
productCardComponent?: React$1.ComponentType<ProductCardProps>;
|
|
5545
5605
|
clusterCardComponent?: React$1.ComponentType<ClusterCardProps>;
|
|
5606
|
+
/**
|
|
5607
|
+
* Render arbitrary content directly below each card's product name (and above
|
|
5608
|
+
* the short description / price). Receives the product; return `null` to
|
|
5609
|
+
* render nothing. Cascades to every ProductCard via ProductGridConfig — lets
|
|
5610
|
+
* hosts surface extra per-product info (e.g. package descriptions) without
|
|
5611
|
+
* swapping the whole card.
|
|
5612
|
+
*/
|
|
5613
|
+
belowName?: (product: Product) => React$1.ReactNode;
|
|
5546
5614
|
beforeItem?: (item: Product | Cluster, index: number) => React$1.ReactNode;
|
|
5547
5615
|
afterItem?: (item: Product | Cluster, index: number) => React$1.ReactNode;
|
|
5548
5616
|
}
|
|
@@ -5556,7 +5624,7 @@ interface ProductGridProps {
|
|
|
5556
5624
|
declare function ProductGrid(rawProps: ProductGridProps): React$1.JSX.Element;
|
|
5557
5625
|
/**
|
|
5558
5626
|
* The items grid. By default renders `<ProductCard>` / `<ClusterCard>` for
|
|
5559
|
-
* each item
|
|
5627
|
+
* each item — but `renderItem` is the proper extension point: pass a
|
|
5560
5628
|
* function that returns whatever shape you want (compound `<ProductCard>`
|
|
5561
5629
|
* with custom subcomponents, a fully custom card, a list row, etc.).
|
|
5562
5630
|
*
|
|
@@ -5575,7 +5643,7 @@ declare function ProductGridItems(props: {
|
|
|
5575
5643
|
}): React$1.JSX.Element;
|
|
5576
5644
|
/**
|
|
5577
5645
|
* Pagination control wired to the parent ProductGrid context. Compact "Prev /
|
|
5578
|
-
* Page X of Y / Next" style by default
|
|
5646
|
+
* Page X of Y / Next" style by default — a future enhancement could expose
|
|
5579
5647
|
* `style="full"` matching GridPagination. For complex pagination, render
|
|
5580
5648
|
* GridPagination directly (it accepts the same context fields as props).
|
|
5581
5649
|
*/
|
|
@@ -5598,6 +5666,16 @@ interface ProductInfoProps {
|
|
|
5598
5666
|
* Overrides default company for price calculation.
|
|
5599
5667
|
* Triggers a re-fetch when changed. */
|
|
5600
5668
|
companyId?: number;
|
|
5669
|
+
/**
|
|
5670
|
+
* Scope the product fetch to specific orderlist IDs (e.g. a chosen B2B
|
|
5671
|
+
* contract). Overrides the default resolution of all the company's orderlists.
|
|
5672
|
+
*/
|
|
5673
|
+
orderlistIds?: number[];
|
|
5674
|
+
/**
|
|
5675
|
+
* Apply the orderlist filter. Defaults to `true`; set `false` to browse
|
|
5676
|
+
* unscoped (full catalogue) for an authenticated user without a contract.
|
|
5677
|
+
*/
|
|
5678
|
+
applyOrderlists?: boolean;
|
|
5601
5679
|
/**
|
|
5602
5680
|
* Pre-fetched product object to display.
|
|
5603
5681
|
* When provided the component skips internal fetching.
|
|
@@ -5631,7 +5709,7 @@ interface ProductInfoProps {
|
|
|
5631
5709
|
*/
|
|
5632
5710
|
taxZone?: string;
|
|
5633
5711
|
/**
|
|
5634
|
-
* Called once the product data is loaded
|
|
5712
|
+
* Called once the product data is loaded — either immediately (when
|
|
5635
5713
|
* `product` prop is supplied) or after the internal fetch completes.
|
|
5636
5714
|
* Use this to hydrate sibling components (gallery, price, descriptions, etc.).
|
|
5637
5715
|
*/
|
|
@@ -5829,7 +5907,7 @@ declare function ProductPriceDisplay(props: ProductPriceProps): React$1.JSX.Elem
|
|
|
5829
5907
|
declare function ProductPriceWithProvider(rawProps: ProductPriceProps): React$1.JSX.Element;
|
|
5830
5908
|
|
|
5831
5909
|
/**
|
|
5832
|
-
* @rsc-safe
|
|
5910
|
+
* @rsc-safe — Pure display component. No React hooks, no event handlers, no
|
|
5833
5911
|
* browser APIs, no context reads. The legacy `'use client'` header was
|
|
5834
5912
|
* removed in C0 once verified pure. Renders directly
|
|
5835
5913
|
* from props and can be imported into a React Server Component.
|
|
@@ -5957,7 +6035,7 @@ interface ProductSliderProps {
|
|
|
5957
6035
|
declare function ProductSlider(rawProps: ProductSliderProps): React$1.JSX.Element;
|
|
5958
6036
|
|
|
5959
6037
|
/**
|
|
5960
|
-
* @rsc-blocked
|
|
6038
|
+
* @rsc-blocked — Client-only component: side effects (useEffect).
|
|
5961
6039
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
5962
6040
|
* imported directly into a React Server Component. The 'use client' header
|
|
5963
6041
|
* above marks this boundary to Next.js.
|
|
@@ -5966,7 +6044,7 @@ declare function ProductSlider(rawProps: ProductSliderProps): React$1.JSX.Elemen
|
|
|
5966
6044
|
interface ProductSpecificationsProps {
|
|
5967
6045
|
/**
|
|
5968
6046
|
* Initialised Propeller SDK GraphQL client.
|
|
5969
|
-
* Required when `productId` is set
|
|
6047
|
+
* Required when `productId` is set — used to fetch public attributes.
|
|
5970
6048
|
*/
|
|
5971
6049
|
graphqlClient?: GraphQLClient;
|
|
5972
6050
|
/**
|
|
@@ -5985,8 +6063,8 @@ interface ProductSpecificationsProps {
|
|
|
5985
6063
|
language?: string;
|
|
5986
6064
|
/**
|
|
5987
6065
|
* Display layout for the specifications.
|
|
5988
|
-
* 'table'
|
|
5989
|
-
* 'list'
|
|
6066
|
+
* 'table' — two-column table (name | value). Default.
|
|
6067
|
+
* 'list' — vertical label + value stacked rows.
|
|
5990
6068
|
*/
|
|
5991
6069
|
layout?: string;
|
|
5992
6070
|
/**
|
|
@@ -5994,6 +6072,11 @@ interface ProductSpecificationsProps {
|
|
|
5994
6072
|
* When false or omitted, displays a flat ungrouped table/list. Default: false.
|
|
5995
6073
|
*/
|
|
5996
6074
|
grouping?: boolean;
|
|
6075
|
+
/**
|
|
6076
|
+
* Optional package-description string (e.g. contents / packaging notes),
|
|
6077
|
+
* rendered above the attribute table. Omitted when empty.
|
|
6078
|
+
*/
|
|
6079
|
+
packageDescription?: string;
|
|
5997
6080
|
/** Extra CSS class applied to the root element. */
|
|
5998
6081
|
className?: string;
|
|
5999
6082
|
}
|
|
@@ -6091,6 +6174,12 @@ interface ProductTabsProps {
|
|
|
6091
6174
|
* Passed as `grouping` to ProductSpecifications.
|
|
6092
6175
|
*/
|
|
6093
6176
|
specificationsGrouping?: boolean;
|
|
6177
|
+
/**
|
|
6178
|
+
* Extra package-description string rendered in the specifications section
|
|
6179
|
+
* (e.g. contents / packaging notes). Passed as `packageDescription` to
|
|
6180
|
+
* ProductSpecifications.
|
|
6181
|
+
*/
|
|
6182
|
+
specificationsPackageDescription?: string;
|
|
6094
6183
|
/**
|
|
6095
6184
|
* Override UI strings for the Downloads section.
|
|
6096
6185
|
* Available keys: title, download
|
|
@@ -6267,7 +6356,7 @@ interface QuoteActionsProps {
|
|
|
6267
6356
|
declare function QuoteActions(rawProps: QuoteActionsProps): React$1.JSX.Element;
|
|
6268
6357
|
|
|
6269
6358
|
/**
|
|
6270
|
-
* @rsc-blocked
|
|
6359
|
+
* @rsc-blocked — Client-only component: browser-only APIs (window/document/storage).
|
|
6271
6360
|
* Must be rendered inside (or below) a Client Component boundary; cannot be
|
|
6272
6361
|
* imported directly into a React Server Component. The 'use client' header
|
|
6273
6362
|
* above marks this boundary to Next.js.
|
|
@@ -6335,7 +6424,7 @@ interface RegisterFormProps {
|
|
|
6335
6424
|
* forwarded so the parent can merge it into the new user's cart.
|
|
6336
6425
|
*/
|
|
6337
6426
|
afterRegistration?: (user: Contact | Customer, accessToken?: string, refreshToken?: string, expiresAt?: string, anonymousCart?: Cart | null) => void;
|
|
6338
|
-
/** Anonymous cart snapshot from the parent's state
|
|
6427
|
+
/** Anonymous cart snapshot from the parent's state — forwarded to `afterRegistration`. */
|
|
6339
6428
|
cart?: Cart | null;
|
|
6340
6429
|
/** Action for the login link click */
|
|
6341
6430
|
onLoginClick?: () => void;
|
|
@@ -6430,6 +6519,14 @@ interface SearchBarProps {
|
|
|
6430
6519
|
* Active company ID from the company switcher.
|
|
6431
6520
|
*/
|
|
6432
6521
|
companyId?: number;
|
|
6522
|
+
/** Scope the autosuggest fetch to specific orderlist IDs (e.g. a chosen B2B contract). */
|
|
6523
|
+
orderlistIds?: number[];
|
|
6524
|
+
/**
|
|
6525
|
+
* Apply the orderlist filter. Defaults to `true` when `orderlistIds` is
|
|
6526
|
+
* non-empty, `false` otherwise — so an authenticated user without a contract
|
|
6527
|
+
* still sees the full catalogue.
|
|
6528
|
+
*/
|
|
6529
|
+
applyOrderlists?: boolean;
|
|
6433
6530
|
/**
|
|
6434
6531
|
* Bump this counter to clear the search input from outside (e.g. on route
|
|
6435
6532
|
* change). Each unique value triggers a one-time reset of the local term.
|