@cimplify/sdk 0.9.10 → 0.10.0
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/dist/{ads-MkGm5l1T.d.mts → ads-BxbWrwqp.d.mts} +0 -8
- package/dist/{ads-MkGm5l1T.d.ts → ads-BxbWrwqp.d.ts} +0 -8
- package/dist/advanced.d.mts +2 -2
- package/dist/advanced.d.ts +2 -2
- package/dist/advanced.js +93 -80
- package/dist/advanced.mjs +93 -80
- package/dist/cli.js +184 -0
- package/dist/{client-BQ1gIg8t.d.mts → client-BSrq89H1.d.mts} +42 -374
- package/dist/{client-C3TQtGuy.d.ts → client-xBhdHLq4.d.ts} +42 -374
- package/dist/index.d.mts +6 -10
- package/dist/index.d.ts +6 -10
- package/dist/index.js +98 -126
- package/dist/index.mjs +98 -126
- package/dist/{payment-CTalZM5l.d.mts → payment-CrNyrc-D.d.mts} +145 -95
- package/dist/{payment-CTalZM5l.d.ts → payment-CrNyrc-D.d.ts} +145 -95
- package/dist/price-C9Z-hr49.d.mts +21 -0
- package/dist/price-RKKoTz-9.d.ts +21 -0
- package/dist/react.d.mts +1285 -35
- package/dist/react.d.ts +1285 -35
- package/dist/react.js +6596 -2598
- package/dist/react.mjs +6550 -2600
- package/dist/utils.d.mts +55 -2
- package/dist/utils.d.ts +55 -2
- package/dist/utils.js +23 -20
- package/dist/utils.mjs +23 -20
- package/package.json +13 -3
- package/registry/add-on-selector.json +15 -0
- package/registry/availability-badge.json +15 -0
- package/registry/booking-card.json +16 -0
- package/registry/booking-list.json +16 -0
- package/registry/booking-page.json +18 -0
- package/registry/bookings-page.json +17 -0
- package/registry/bundle-selector.json +15 -0
- package/registry/cart-page.json +17 -0
- package/registry/cart-summary.json +16 -0
- package/registry/catalogue-page.json +18 -0
- package/registry/category-filter.json +15 -0
- package/registry/category-grid.json +15 -0
- package/registry/checkout-page.json +15 -0
- package/registry/cn.json +13 -0
- package/registry/collection-page.json +16 -0
- package/registry/composite-selector.json +15 -0
- package/registry/date-slot-picker.json +16 -0
- package/registry/deal-banner.json +16 -0
- package/registry/deals-page.json +19 -0
- package/registry/discount-input.json +16 -0
- package/registry/index.json +411 -0
- package/registry/order-detail-page.json +16 -0
- package/registry/order-history-page.json +17 -0
- package/registry/order-history.json +16 -0
- package/registry/order-summary.json +16 -0
- package/registry/price.json +13 -0
- package/registry/product-card.json +17 -0
- package/registry/product-customizer.json +20 -0
- package/registry/product-grid.json +16 -0
- package/registry/product-image-gallery.json +13 -0
- package/registry/product-page.json +19 -0
- package/registry/product-sheet.json +18 -0
- package/registry/quantity-selector.json +13 -0
- package/registry/sale-badge.json +16 -0
- package/registry/search-input.json +15 -0
- package/registry/search-page.json +16 -0
- package/registry/service-card.json +16 -0
- package/registry/service-grid.json +16 -0
- package/registry/slot-picker.json +16 -0
- package/registry/staff-picker.json +15 -0
- package/registry/store-nav.json +15 -0
- package/registry/variant-selector.json +15 -0
- package/dist/index-B_25cFc1.d.ts +0 -320
- package/dist/index-Cd0shhZU.d.mts +0 -320
package/dist/react.d.ts
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
|
-
import { A as AdSlot, a as AdPosition, e as AdContextValue } from './ads-
|
|
3
|
-
export { c as AdConfig, g as getVariantDisplayName } from './ads-
|
|
4
|
-
import { C as CimplifyClient,
|
|
5
|
-
import {
|
|
2
|
+
import { A as AdSlot, a as AdPosition, e as AdContextValue } from './ads-BxbWrwqp.js';
|
|
3
|
+
export { c as AdConfig, g as getVariantDisplayName } from './ads-BxbWrwqp.js';
|
|
4
|
+
import { C as CimplifyClient, Z as ProcessCheckoutResult, $ as CheckoutStatus, a0 as CheckoutStatusContext, br as Location, bo as Business, aT as Order, d as QuoteBundleSelectionInput, Q as QuoteCompositeSelectionInput, P as PriceQuote, g as QuoteUiMessage, aG as OrderStatus, bE as Service, bH as AvailableSlot, bI as DayAvailability, bN as CustomerBooking, bT as CancelBookingResult, x as ElementsOptions, cH as AuthenticatedData, cD as AddressInfo, cE as PaymentMethodInfo, t as CimplifyElements, cJ as ElementsCheckoutResult, Y as ProcessCheckoutOptions, aS as LineItem, bF as Staff } from './client-xBhdHLq4.js';
|
|
5
|
+
import { r as Product, b as Pagination, g as CimplifyError, s as ProductWithDetails, L as Category, M as Money, aM as BundleSelectionInput, ae as ComponentSelectionInput, O as Collection, am as ProductTaxonomy, an as TaxonomyWithChildren, al as ProductTimeProfile, aq as Deal, ar as ProductDealInfo, as as DiscountValidation, W as BundleSummary, af as CompositePriceResult, C as CurrencyCode, t as ProductVariant, w as VariantAxisWithValues, G as AddOnWithOptions, a0 as BundleComponentView, T as BundlePriceType, ab as CompositeGroupView } from './payment-CrNyrc-D.js';
|
|
6
|
+
import { P as ProductWithPrice } from './price-RKKoTz-9.js';
|
|
7
|
+
import { ClassValue } from 'clsx';
|
|
6
8
|
|
|
7
9
|
interface UserIdentity {
|
|
8
10
|
uid: string;
|
|
@@ -128,9 +130,17 @@ declare function useOptionalCimplify(): CimplifyContextValue | null;
|
|
|
128
130
|
interface UseProductsOptions {
|
|
129
131
|
category?: string;
|
|
130
132
|
collection?: string;
|
|
133
|
+
taxonomy?: string;
|
|
131
134
|
search?: string;
|
|
132
135
|
featured?: boolean;
|
|
133
136
|
limit?: number;
|
|
137
|
+
sort_by?: "name" | "price" | "created_at";
|
|
138
|
+
sort_order?: "asc" | "desc";
|
|
139
|
+
tags?: string[];
|
|
140
|
+
in_stock?: boolean;
|
|
141
|
+
min_price?: number;
|
|
142
|
+
max_price?: number;
|
|
143
|
+
page?: number;
|
|
134
144
|
enabled?: boolean;
|
|
135
145
|
client?: CimplifyClient;
|
|
136
146
|
}
|
|
@@ -172,13 +182,13 @@ declare function useCategories(options?: UseCategoriesOptions): UseCategoriesRes
|
|
|
172
182
|
interface CartVariantSelection {
|
|
173
183
|
id: string;
|
|
174
184
|
name: string;
|
|
175
|
-
price_adjustment?:
|
|
185
|
+
price_adjustment?: Money;
|
|
176
186
|
}
|
|
177
187
|
interface CartAddOnOptionSelection {
|
|
178
188
|
id: string;
|
|
179
189
|
name: string;
|
|
180
190
|
add_on_id?: string;
|
|
181
|
-
default_price?:
|
|
191
|
+
default_price?: Money;
|
|
182
192
|
}
|
|
183
193
|
interface UseCartItem {
|
|
184
194
|
id: string;
|
|
@@ -193,6 +203,9 @@ interface UseCartItem {
|
|
|
193
203
|
bundleSelections?: BundleSelectionInput[];
|
|
194
204
|
compositeSelections?: ComponentSelectionInput[];
|
|
195
205
|
specialInstructions?: string;
|
|
206
|
+
scheduledStart?: string;
|
|
207
|
+
scheduledEnd?: string;
|
|
208
|
+
staffId?: string;
|
|
196
209
|
}
|
|
197
210
|
interface AddToCartOptions {
|
|
198
211
|
locationId?: string;
|
|
@@ -204,6 +217,9 @@ interface AddToCartOptions {
|
|
|
204
217
|
bundleSelections?: BundleSelectionInput[];
|
|
205
218
|
compositeSelections?: ComponentSelectionInput[];
|
|
206
219
|
specialInstructions?: string;
|
|
220
|
+
scheduledStart?: string;
|
|
221
|
+
scheduledEnd?: string;
|
|
222
|
+
staffId?: string;
|
|
207
223
|
}
|
|
208
224
|
interface UseCartOptions {
|
|
209
225
|
client?: CimplifyClient;
|
|
@@ -320,6 +336,214 @@ interface UseQuoteResult {
|
|
|
320
336
|
}
|
|
321
337
|
declare function useQuote(input: UseQuoteInput | null | undefined, options?: UseQuoteOptions): UseQuoteResult;
|
|
322
338
|
|
|
339
|
+
interface UseTaxonomiesOptions {
|
|
340
|
+
parentId?: string;
|
|
341
|
+
enabled?: boolean;
|
|
342
|
+
client?: CimplifyClient;
|
|
343
|
+
}
|
|
344
|
+
interface UseTaxonomiesResult {
|
|
345
|
+
taxonomies: ProductTaxonomy[];
|
|
346
|
+
isLoading: boolean;
|
|
347
|
+
error: CimplifyError | null;
|
|
348
|
+
refetch: () => Promise<void>;
|
|
349
|
+
}
|
|
350
|
+
declare function useTaxonomies(options?: UseTaxonomiesOptions): UseTaxonomiesResult;
|
|
351
|
+
|
|
352
|
+
interface UseTaxonomyOptions {
|
|
353
|
+
enabled?: boolean;
|
|
354
|
+
client?: CimplifyClient;
|
|
355
|
+
}
|
|
356
|
+
interface UseTaxonomyResult {
|
|
357
|
+
taxonomy: TaxonomyWithChildren | null;
|
|
358
|
+
isLoading: boolean;
|
|
359
|
+
error: CimplifyError | null;
|
|
360
|
+
refetch: () => Promise<void>;
|
|
361
|
+
}
|
|
362
|
+
declare function useTaxonomy(id: string, options?: UseTaxonomyOptions): UseTaxonomyResult;
|
|
363
|
+
|
|
364
|
+
interface UseTaxonomyPathOptions {
|
|
365
|
+
enabled?: boolean;
|
|
366
|
+
client?: CimplifyClient;
|
|
367
|
+
}
|
|
368
|
+
interface UseTaxonomyPathResult {
|
|
369
|
+
path: ProductTaxonomy[];
|
|
370
|
+
isLoading: boolean;
|
|
371
|
+
error: CimplifyError | null;
|
|
372
|
+
refetch: () => Promise<void>;
|
|
373
|
+
}
|
|
374
|
+
declare function useTaxonomyPath(id: string, options?: UseTaxonomyPathOptions): UseTaxonomyPathResult;
|
|
375
|
+
|
|
376
|
+
interface UseProductSchedulesOptions {
|
|
377
|
+
enabled?: boolean;
|
|
378
|
+
client?: CimplifyClient;
|
|
379
|
+
}
|
|
380
|
+
interface UseProductSchedulesResult {
|
|
381
|
+
schedules: ProductTimeProfile[];
|
|
382
|
+
isLoading: boolean;
|
|
383
|
+
error: CimplifyError | null;
|
|
384
|
+
refetch: () => Promise<void>;
|
|
385
|
+
}
|
|
386
|
+
declare function useProductSchedules(productId: string, options?: UseProductSchedulesOptions): UseProductSchedulesResult;
|
|
387
|
+
|
|
388
|
+
interface UseProductAvailabilityOptions {
|
|
389
|
+
locationId?: string;
|
|
390
|
+
enabled?: boolean;
|
|
391
|
+
client?: CimplifyClient;
|
|
392
|
+
}
|
|
393
|
+
interface UseProductAvailabilityResult {
|
|
394
|
+
isAvailable: boolean | null;
|
|
395
|
+
schedulesToday: ProductTimeProfile[];
|
|
396
|
+
isLoading: boolean;
|
|
397
|
+
error: CimplifyError | null;
|
|
398
|
+
refetch: () => Promise<void>;
|
|
399
|
+
}
|
|
400
|
+
declare function useProductAvailability(productId: string, options?: UseProductAvailabilityOptions): UseProductAvailabilityResult;
|
|
401
|
+
|
|
402
|
+
interface UseDealsOptions {
|
|
403
|
+
locationId?: string;
|
|
404
|
+
enabled?: boolean;
|
|
405
|
+
client?: CimplifyClient;
|
|
406
|
+
}
|
|
407
|
+
interface UseDealsResult {
|
|
408
|
+
deals: Deal[];
|
|
409
|
+
isLoading: boolean;
|
|
410
|
+
error: CimplifyError | null;
|
|
411
|
+
refetch: () => Promise<void>;
|
|
412
|
+
}
|
|
413
|
+
declare function useDeals(options?: UseDealsOptions): UseDealsResult;
|
|
414
|
+
|
|
415
|
+
interface UseProductsOnSaleOptions {
|
|
416
|
+
enabled?: boolean;
|
|
417
|
+
client?: CimplifyClient;
|
|
418
|
+
}
|
|
419
|
+
interface UseProductsOnSaleResult {
|
|
420
|
+
products: ProductDealInfo[];
|
|
421
|
+
isLoading: boolean;
|
|
422
|
+
error: CimplifyError | null;
|
|
423
|
+
refetch: () => Promise<void>;
|
|
424
|
+
}
|
|
425
|
+
declare function useProductsOnSale(options?: UseProductsOnSaleOptions): UseProductsOnSaleResult;
|
|
426
|
+
|
|
427
|
+
interface UseProductDealsOptions {
|
|
428
|
+
enabled?: boolean;
|
|
429
|
+
client?: CimplifyClient;
|
|
430
|
+
}
|
|
431
|
+
interface UseProductDealsResult {
|
|
432
|
+
deals: Deal[];
|
|
433
|
+
isLoading: boolean;
|
|
434
|
+
error: CimplifyError | null;
|
|
435
|
+
refetch: () => Promise<void>;
|
|
436
|
+
}
|
|
437
|
+
declare function useProductDeals(productId: string, options?: UseProductDealsOptions): UseProductDealsResult;
|
|
438
|
+
|
|
439
|
+
interface UseValidateDiscountOptions {
|
|
440
|
+
client?: CimplifyClient;
|
|
441
|
+
}
|
|
442
|
+
interface UseValidateDiscountResult {
|
|
443
|
+
validate: (code: string, orderSubtotal: string, locationId?: string) => Promise<DiscountValidation | null>;
|
|
444
|
+
isValidating: boolean;
|
|
445
|
+
error: CimplifyError | null;
|
|
446
|
+
}
|
|
447
|
+
declare function useValidateDiscount(options?: UseValidateDiscountOptions): UseValidateDiscountResult;
|
|
448
|
+
|
|
449
|
+
interface UseBundlesOptions {
|
|
450
|
+
enabled?: boolean;
|
|
451
|
+
client?: CimplifyClient;
|
|
452
|
+
}
|
|
453
|
+
interface UseBundlesResult {
|
|
454
|
+
bundles: BundleSummary[];
|
|
455
|
+
isLoading: boolean;
|
|
456
|
+
error: CimplifyError | null;
|
|
457
|
+
refetch: () => Promise<void>;
|
|
458
|
+
}
|
|
459
|
+
declare function useBundles(options?: UseBundlesOptions): UseBundlesResult;
|
|
460
|
+
|
|
461
|
+
interface UseProductPriceInput {
|
|
462
|
+
product: Product | ProductWithDetails;
|
|
463
|
+
quantity?: number;
|
|
464
|
+
variant?: {
|
|
465
|
+
price_adjustment?: number | string;
|
|
466
|
+
};
|
|
467
|
+
addOnOptions?: Array<{
|
|
468
|
+
default_price?: number | string;
|
|
469
|
+
}>;
|
|
470
|
+
compositePrice?: CompositePriceResult | null;
|
|
471
|
+
bundleTotalPrice?: number | null;
|
|
472
|
+
}
|
|
473
|
+
interface UseProductPriceResult {
|
|
474
|
+
unitPrice: number;
|
|
475
|
+
totalPrice: number;
|
|
476
|
+
displayTotalPrice: number;
|
|
477
|
+
}
|
|
478
|
+
declare function useProductPrice(input: UseProductPriceInput): UseProductPriceResult;
|
|
479
|
+
|
|
480
|
+
interface UseOrdersOptions {
|
|
481
|
+
status?: OrderStatus;
|
|
482
|
+
limit?: number;
|
|
483
|
+
enabled?: boolean;
|
|
484
|
+
client?: CimplifyClient;
|
|
485
|
+
}
|
|
486
|
+
interface UseOrdersResult {
|
|
487
|
+
orders: Order[];
|
|
488
|
+
isLoading: boolean;
|
|
489
|
+
error: CimplifyError | null;
|
|
490
|
+
refetch: () => Promise<void>;
|
|
491
|
+
}
|
|
492
|
+
declare function useOrders(options?: UseOrdersOptions): UseOrdersResult;
|
|
493
|
+
|
|
494
|
+
interface UseServicesOptions {
|
|
495
|
+
enabled?: boolean;
|
|
496
|
+
client?: CimplifyClient;
|
|
497
|
+
}
|
|
498
|
+
interface UseServicesResult {
|
|
499
|
+
services: Service[];
|
|
500
|
+
isLoading: boolean;
|
|
501
|
+
error: CimplifyError | null;
|
|
502
|
+
refetch: () => Promise<void>;
|
|
503
|
+
}
|
|
504
|
+
declare function useServices(options?: UseServicesOptions): UseServicesResult;
|
|
505
|
+
|
|
506
|
+
interface UseAvailableSlotsOptions {
|
|
507
|
+
participantCount?: number;
|
|
508
|
+
enabled?: boolean;
|
|
509
|
+
client?: CimplifyClient;
|
|
510
|
+
}
|
|
511
|
+
interface UseAvailableSlotsResult {
|
|
512
|
+
slots: AvailableSlot[];
|
|
513
|
+
isLoading: boolean;
|
|
514
|
+
error: CimplifyError | null;
|
|
515
|
+
refetch: () => Promise<void>;
|
|
516
|
+
}
|
|
517
|
+
declare function useAvailableSlots(serviceId: string | null, date: string | null, options?: UseAvailableSlotsOptions): UseAvailableSlotsResult;
|
|
518
|
+
|
|
519
|
+
interface UseServiceAvailabilityOptions {
|
|
520
|
+
participantCount?: number;
|
|
521
|
+
locationId?: string;
|
|
522
|
+
enabled?: boolean;
|
|
523
|
+
client?: CimplifyClient;
|
|
524
|
+
}
|
|
525
|
+
interface UseServiceAvailabilityResult {
|
|
526
|
+
days: DayAvailability[];
|
|
527
|
+
isLoading: boolean;
|
|
528
|
+
error: CimplifyError | null;
|
|
529
|
+
refetch: () => Promise<void>;
|
|
530
|
+
}
|
|
531
|
+
declare function useServiceAvailability(serviceId: string | null, startDate: string | null, endDate: string | null, options?: UseServiceAvailabilityOptions): UseServiceAvailabilityResult;
|
|
532
|
+
|
|
533
|
+
interface UseBookingsOptions {
|
|
534
|
+
filter?: "all" | "upcoming" | "past";
|
|
535
|
+
enabled?: boolean;
|
|
536
|
+
client?: CimplifyClient;
|
|
537
|
+
}
|
|
538
|
+
interface UseBookingsResult {
|
|
539
|
+
bookings: CustomerBooking[];
|
|
540
|
+
isLoading: boolean;
|
|
541
|
+
error: CimplifyError | null;
|
|
542
|
+
refetch: () => Promise<void>;
|
|
543
|
+
cancelBooking: (bookingId: string, reason?: string) => Promise<CancelBookingResult>;
|
|
544
|
+
}
|
|
545
|
+
declare function useBookings(options?: UseBookingsOptions): UseBookingsResult;
|
|
546
|
+
|
|
323
547
|
declare function useElements(): CimplifyElements | null;
|
|
324
548
|
declare function useElementsReady(): boolean;
|
|
325
549
|
interface ElementsProviderProps {
|
|
@@ -424,20 +648,13 @@ interface BundleSelectorProps {
|
|
|
424
648
|
components: BundleComponentView[];
|
|
425
649
|
bundlePrice?: Money;
|
|
426
650
|
discountValue?: Money;
|
|
651
|
+
pricingType?: BundlePriceType;
|
|
427
652
|
onSelectionsChange: (selections: BundleSelectionInput[]) => void;
|
|
653
|
+
onPriceChange?: (price: number) => void;
|
|
428
654
|
onReady?: (ready: boolean) => void;
|
|
429
655
|
className?: string;
|
|
430
656
|
}
|
|
431
|
-
|
|
432
|
-
* BundleSelector — curated product set with optional variant choices.
|
|
433
|
-
*
|
|
434
|
-
* Each bundle component shows the included product. If `allow_variant_choice`
|
|
435
|
-
* is true, the customer can pick which variant they want for that slot.
|
|
436
|
-
*
|
|
437
|
-
* Accepts pre-fetched `BundleComponentView[]` from the product detail response
|
|
438
|
-
* — no internal data fetching.
|
|
439
|
-
*/
|
|
440
|
-
declare function BundleSelector({ components, bundlePrice, discountValue, onSelectionsChange, onReady, className, }: BundleSelectorProps): React.ReactElement | null;
|
|
657
|
+
declare function BundleSelector({ components, bundlePrice, discountValue, pricingType, onSelectionsChange, onPriceChange, onReady, className, }: BundleSelectorProps): React.ReactElement | null;
|
|
441
658
|
|
|
442
659
|
interface CompositeSelectorProps {
|
|
443
660
|
compositeId: string;
|
|
@@ -445,32 +662,17 @@ interface CompositeSelectorProps {
|
|
|
445
662
|
onSelectionsChange: (selections: ComponentSelectionInput[]) => void;
|
|
446
663
|
onPriceChange?: (price: CompositePriceResult | null) => void;
|
|
447
664
|
onReady?: (ready: boolean) => void;
|
|
665
|
+
/** Skip the local composite price fetch when the quote system handles pricing */
|
|
666
|
+
skipPriceFetch?: boolean;
|
|
448
667
|
className?: string;
|
|
449
668
|
}
|
|
450
|
-
|
|
451
|
-
* CompositeSelector — "build your own" product configurator.
|
|
452
|
-
*
|
|
453
|
-
* Renders component groups (e.g. "Choose your base", "Pick toppings") with
|
|
454
|
-
* min/max selection constraints. Calculates real-time pricing via the SDK.
|
|
455
|
-
*
|
|
456
|
-
* Accepts pre-fetched `CompositeGroupView[]` from the product detail response
|
|
457
|
-
* — no internal data fetching, only live pricing calls.
|
|
458
|
-
*/
|
|
459
|
-
declare function CompositeSelector({ compositeId, groups, onSelectionsChange, onPriceChange, onReady, className, }: CompositeSelectorProps): React.ReactElement | null;
|
|
669
|
+
declare function CompositeSelector({ compositeId, groups, onSelectionsChange, onPriceChange, onReady, skipPriceFetch, className, }: CompositeSelectorProps): React.ReactElement | null;
|
|
460
670
|
|
|
461
671
|
interface ProductCustomizerProps {
|
|
462
672
|
product: ProductWithDetails;
|
|
463
673
|
onAddToCart?: (product: ProductWithDetails, quantity: number, options: AddToCartOptions) => void | Promise<void>;
|
|
464
674
|
className?: string;
|
|
465
675
|
}
|
|
466
|
-
/**
|
|
467
|
-
* ProductCustomizer — full product customization + add-to-cart flow.
|
|
468
|
-
*
|
|
469
|
-
* Auto-detects product type and routes to CompositeSelector / BundleSelector /
|
|
470
|
-
* VariantSelector + AddOnSelector. Ships a built-in "Add to Cart" button with
|
|
471
|
-
* QuantitySelector. When `onAddToCart` is provided it calls that instead of
|
|
472
|
-
* using the SDK cart (escape hatch for custom logic like toasts).
|
|
473
|
-
*/
|
|
474
676
|
declare function ProductCustomizer({ product, onAddToCart, className, }: ProductCustomizerProps): React.ReactElement;
|
|
475
677
|
|
|
476
678
|
interface ProductImageGalleryProps {
|
|
@@ -501,4 +703,1052 @@ interface CartSummaryProps {
|
|
|
501
703
|
*/
|
|
502
704
|
declare function CartSummary({ onCheckout, onItemRemove, onQuantityChange, emptyMessage, className, }: CartSummaryProps): React.ReactElement;
|
|
503
705
|
|
|
504
|
-
|
|
706
|
+
interface AvailabilityBadgeClassNames {
|
|
707
|
+
root?: string;
|
|
708
|
+
dot?: string;
|
|
709
|
+
label?: string;
|
|
710
|
+
}
|
|
711
|
+
interface AvailabilityBadgeProps {
|
|
712
|
+
/** The product to check availability for. */
|
|
713
|
+
product: Product;
|
|
714
|
+
/** Override availability (e.g. from location_availability). */
|
|
715
|
+
isAvailable?: boolean;
|
|
716
|
+
/** Override stock status (e.g. from location_availability). */
|
|
717
|
+
isInStock?: boolean;
|
|
718
|
+
className?: string;
|
|
719
|
+
classNames?: AvailabilityBadgeClassNames;
|
|
720
|
+
}
|
|
721
|
+
/**
|
|
722
|
+
* AvailabilityBadge — displays in-stock / out-of-stock status for tracked products.
|
|
723
|
+
*
|
|
724
|
+
* Returns `null` for products that don't have inventory tracking enabled,
|
|
725
|
+
* since there's no meaningful stock state to show.
|
|
726
|
+
*/
|
|
727
|
+
declare function AvailabilityBadge({ product, isAvailable, isInStock, className, classNames, }: AvailabilityBadgeProps): React.ReactElement | null;
|
|
728
|
+
|
|
729
|
+
interface SaleBadgeClassNames {
|
|
730
|
+
root?: string;
|
|
731
|
+
percentage?: string;
|
|
732
|
+
label?: string;
|
|
733
|
+
originalPrice?: string;
|
|
734
|
+
}
|
|
735
|
+
interface SaleBadgeProps {
|
|
736
|
+
/** Product, optionally enriched with price_info for sale detection. */
|
|
737
|
+
product: Product & Partial<ProductWithPrice>;
|
|
738
|
+
/** Deal info from useProductDeals / useProductsOnSale. */
|
|
739
|
+
dealInfo?: ProductDealInfo;
|
|
740
|
+
/** Override badge text entirely. */
|
|
741
|
+
label?: string;
|
|
742
|
+
/** Show the original (pre-discount) price with strikethrough styling. */
|
|
743
|
+
showOriginalPrice?: boolean;
|
|
744
|
+
/** Show the percentage off. Default: true. */
|
|
745
|
+
showPercentage?: boolean;
|
|
746
|
+
className?: string;
|
|
747
|
+
classNames?: SaleBadgeClassNames;
|
|
748
|
+
}
|
|
749
|
+
/**
|
|
750
|
+
* SaleBadge — shows a sale/discount indicator for a product.
|
|
751
|
+
*
|
|
752
|
+
* Returns `null` when there's no deal, no sale price difference, and no label override,
|
|
753
|
+
* so it's safe to render unconditionally — it simply won't show for non-sale products.
|
|
754
|
+
*/
|
|
755
|
+
declare function SaleBadge({ product, dealInfo, label, showOriginalPrice, showPercentage, className, classNames, }: SaleBadgeProps): React.ReactElement | null;
|
|
756
|
+
|
|
757
|
+
interface ProductSheetClassNames {
|
|
758
|
+
root?: string;
|
|
759
|
+
image?: string;
|
|
760
|
+
header?: string;
|
|
761
|
+
name?: string;
|
|
762
|
+
price?: string;
|
|
763
|
+
description?: string;
|
|
764
|
+
customizer?: string;
|
|
765
|
+
loading?: string;
|
|
766
|
+
}
|
|
767
|
+
interface ProductSheetProps {
|
|
768
|
+
/** A slim Product (triggers lazy-fetch) or a fully-loaded ProductWithDetails. */
|
|
769
|
+
product: Product | ProductWithDetails;
|
|
770
|
+
/** Called when the sheet should close. */
|
|
771
|
+
onClose?: () => void;
|
|
772
|
+
/** Override the default add-to-cart behavior. */
|
|
773
|
+
onAddToCart?: (product: ProductWithDetails, quantity: number, options: AddToCartOptions) => void | Promise<void>;
|
|
774
|
+
/** Custom image renderer (e.g. Next.js Image). */
|
|
775
|
+
renderImage?: (props: {
|
|
776
|
+
src: string;
|
|
777
|
+
alt: string;
|
|
778
|
+
className?: string;
|
|
779
|
+
}) => React.ReactNode;
|
|
780
|
+
className?: string;
|
|
781
|
+
classNames?: ProductSheetClassNames;
|
|
782
|
+
}
|
|
783
|
+
/**
|
|
784
|
+
* ProductSheet — full product detail view composing gallery, header, and customizer.
|
|
785
|
+
*
|
|
786
|
+
* When given a slim `Product`, it lazy-fetches the full details via `useProduct`.
|
|
787
|
+
* When given a `ProductWithDetails`, it skips the fetch entirely.
|
|
788
|
+
*/
|
|
789
|
+
declare function ProductSheet({ product, onClose, onAddToCart, renderImage, className, classNames, }: ProductSheetProps): React.ReactElement;
|
|
790
|
+
|
|
791
|
+
interface ProductCardClassNames {
|
|
792
|
+
root?: string;
|
|
793
|
+
imageContainer?: string;
|
|
794
|
+
image?: string;
|
|
795
|
+
body?: string;
|
|
796
|
+
name?: string;
|
|
797
|
+
description?: string;
|
|
798
|
+
price?: string;
|
|
799
|
+
badges?: string;
|
|
800
|
+
badge?: string;
|
|
801
|
+
modal?: string;
|
|
802
|
+
modalOverlay?: string;
|
|
803
|
+
}
|
|
804
|
+
interface ProductCardProps {
|
|
805
|
+
/** The product to display. */
|
|
806
|
+
product: Product;
|
|
807
|
+
/** Display mode: "card" opens a modal, "page" renders as a link. Auto-detected from product.display_mode. */
|
|
808
|
+
displayMode?: "card" | "page";
|
|
809
|
+
/** Link href for page mode. Default: `/menu/${product.slug}` */
|
|
810
|
+
href?: string;
|
|
811
|
+
/** Custom modal content renderer. Receives the fully-loaded product. */
|
|
812
|
+
renderModal?: (product: ProductWithDetails) => React.ReactNode;
|
|
813
|
+
/** Custom image renderer (e.g. Next.js Image). */
|
|
814
|
+
renderImage?: (props: {
|
|
815
|
+
src: string;
|
|
816
|
+
alt: string;
|
|
817
|
+
className?: string;
|
|
818
|
+
}) => React.ReactNode;
|
|
819
|
+
/** Replace the entire default card body. */
|
|
820
|
+
children?: React.ReactNode;
|
|
821
|
+
/** Image aspect ratio. Default: "4/3". */
|
|
822
|
+
aspectRatio?: "square" | "4/3" | "16/10" | "3/4";
|
|
823
|
+
className?: string;
|
|
824
|
+
classNames?: ProductCardClassNames;
|
|
825
|
+
}
|
|
826
|
+
/**
|
|
827
|
+
* ProductCard — a product display card with two modes:
|
|
828
|
+
*
|
|
829
|
+
* - **card** (default): clickable button that opens a native `<dialog>` modal with a ProductSheet
|
|
830
|
+
* - **page**: a plain `<a>` link for SEO-friendly product pages
|
|
831
|
+
*/
|
|
832
|
+
declare function ProductCard({ product, displayMode, href, renderModal, renderImage, children, aspectRatio, className, classNames, }: ProductCardProps): React.ReactElement;
|
|
833
|
+
|
|
834
|
+
interface ProductGridClassNames {
|
|
835
|
+
root?: string;
|
|
836
|
+
item?: string;
|
|
837
|
+
empty?: string;
|
|
838
|
+
}
|
|
839
|
+
interface ProductGridProps {
|
|
840
|
+
/** Products to display in the grid. */
|
|
841
|
+
products: Product[];
|
|
842
|
+
/** Responsive column counts at each breakpoint. */
|
|
843
|
+
columns?: {
|
|
844
|
+
sm?: number;
|
|
845
|
+
md?: number;
|
|
846
|
+
lg?: number;
|
|
847
|
+
xl?: number;
|
|
848
|
+
};
|
|
849
|
+
/** Custom card renderer per product. */
|
|
850
|
+
renderCard?: (product: Product) => React.ReactNode;
|
|
851
|
+
/** Custom image renderer passed to default ProductCards. */
|
|
852
|
+
renderImage?: (props: {
|
|
853
|
+
src: string;
|
|
854
|
+
alt: string;
|
|
855
|
+
className?: string;
|
|
856
|
+
}) => React.ReactNode;
|
|
857
|
+
/** Text shown when `products` is empty. */
|
|
858
|
+
emptyMessage?: string;
|
|
859
|
+
className?: string;
|
|
860
|
+
classNames?: ProductGridClassNames;
|
|
861
|
+
}
|
|
862
|
+
/**
|
|
863
|
+
* ProductGrid — responsive CSS grid that renders ProductCards.
|
|
864
|
+
*
|
|
865
|
+
* Injects an inline `<style>` tag with media queries for responsive columns.
|
|
866
|
+
* Uses `React.useId()` for a hydration-safe, collision-free CSS selector.
|
|
867
|
+
*/
|
|
868
|
+
declare function ProductGrid({ products, columns, renderCard, renderImage, emptyMessage, className, classNames, }: ProductGridProps): React.ReactElement;
|
|
869
|
+
|
|
870
|
+
declare function cn(...inputs: ClassValue[]): string;
|
|
871
|
+
|
|
872
|
+
interface SearchInputClassNames {
|
|
873
|
+
root?: string;
|
|
874
|
+
input?: string;
|
|
875
|
+
clearButton?: string;
|
|
876
|
+
results?: string;
|
|
877
|
+
resultItem?: string;
|
|
878
|
+
empty?: string;
|
|
879
|
+
loading?: string;
|
|
880
|
+
}
|
|
881
|
+
interface SearchInputProps {
|
|
882
|
+
/** Placeholder text for the input. */
|
|
883
|
+
placeholder?: string;
|
|
884
|
+
/** Search options forwarded to useSearch. */
|
|
885
|
+
searchOptions?: UseSearchOptions;
|
|
886
|
+
/** Called when a product result is clicked. */
|
|
887
|
+
onResultClick?: (product: Product) => void;
|
|
888
|
+
/** Custom result item renderer. */
|
|
889
|
+
renderResult?: (product: Product) => React.ReactNode;
|
|
890
|
+
/** Show inline results dropdown. Default: true. */
|
|
891
|
+
showResults?: boolean;
|
|
892
|
+
className?: string;
|
|
893
|
+
classNames?: SearchInputClassNames;
|
|
894
|
+
}
|
|
895
|
+
/**
|
|
896
|
+
* SearchInput — search bar with debounced results dropdown.
|
|
897
|
+
*
|
|
898
|
+
* Wraps `useSearch` with a controlled input and optional inline results list.
|
|
899
|
+
*/
|
|
900
|
+
declare function SearchInput({ placeholder, searchOptions, onResultClick, renderResult, showResults, className, classNames, }: SearchInputProps): React.ReactElement;
|
|
901
|
+
|
|
902
|
+
interface CategoryFilterClassNames {
|
|
903
|
+
root?: string;
|
|
904
|
+
item?: string;
|
|
905
|
+
allButton?: string;
|
|
906
|
+
count?: string;
|
|
907
|
+
}
|
|
908
|
+
interface CategoryFilterProps {
|
|
909
|
+
/** Currently selected category ID. Null means "all". */
|
|
910
|
+
selectedId?: string | null;
|
|
911
|
+
/** Called when a category is selected. Null means "all". */
|
|
912
|
+
onSelect: (categoryId: string | null) => void;
|
|
913
|
+
/** Label for the "all" option. Default: "All". */
|
|
914
|
+
allLabel?: string;
|
|
915
|
+
/** Show product counts per category. Default: true. */
|
|
916
|
+
showCounts?: boolean;
|
|
917
|
+
className?: string;
|
|
918
|
+
classNames?: CategoryFilterClassNames;
|
|
919
|
+
}
|
|
920
|
+
/**
|
|
921
|
+
* CategoryFilter — horizontal or vertical list of category chips.
|
|
922
|
+
*
|
|
923
|
+
* Fetches categories via `useCategories` and renders selectable buttons.
|
|
924
|
+
* The parent controls selection state via `selectedId` + `onSelect`.
|
|
925
|
+
*/
|
|
926
|
+
declare function CategoryFilter({ selectedId, onSelect, allLabel, showCounts, className, classNames, }: CategoryFilterProps): React.ReactElement;
|
|
927
|
+
|
|
928
|
+
interface DiscountInputClassNames {
|
|
929
|
+
root?: string;
|
|
930
|
+
input?: string;
|
|
931
|
+
button?: string;
|
|
932
|
+
result?: string;
|
|
933
|
+
error?: string;
|
|
934
|
+
success?: string;
|
|
935
|
+
}
|
|
936
|
+
interface DiscountInputProps {
|
|
937
|
+
/** Current order subtotal for validation. */
|
|
938
|
+
orderSubtotal: string;
|
|
939
|
+
/** Location ID for location-specific discounts. */
|
|
940
|
+
locationId?: string;
|
|
941
|
+
/** Called when a valid discount is applied. */
|
|
942
|
+
onApply?: (validation: DiscountValidation) => void;
|
|
943
|
+
/** Called when discount is cleared. */
|
|
944
|
+
onClear?: () => void;
|
|
945
|
+
/** Placeholder text. */
|
|
946
|
+
placeholder?: string;
|
|
947
|
+
className?: string;
|
|
948
|
+
classNames?: DiscountInputClassNames;
|
|
949
|
+
}
|
|
950
|
+
/**
|
|
951
|
+
* DiscountInput — discount code input with inline validation.
|
|
952
|
+
*
|
|
953
|
+
* Wraps `useValidateDiscount` with a text input and apply button.
|
|
954
|
+
* Shows validation result inline (success with amount, or error).
|
|
955
|
+
*/
|
|
956
|
+
declare function DiscountInput({ orderSubtotal, locationId, onApply, onClear, placeholder, className, classNames, }: DiscountInputProps): React.ReactElement;
|
|
957
|
+
|
|
958
|
+
interface CategoryGridClassNames {
|
|
959
|
+
root?: string;
|
|
960
|
+
item?: string;
|
|
961
|
+
name?: string;
|
|
962
|
+
description?: string;
|
|
963
|
+
count?: string;
|
|
964
|
+
empty?: string;
|
|
965
|
+
}
|
|
966
|
+
interface CategoryGridProps {
|
|
967
|
+
/** Override categories (skips useCategories fetch). */
|
|
968
|
+
categories?: Category[];
|
|
969
|
+
/** Called when a category card is clicked. */
|
|
970
|
+
onSelect?: (category: Category) => void;
|
|
971
|
+
/** Custom card renderer. */
|
|
972
|
+
renderCard?: (category: Category) => React.ReactNode;
|
|
973
|
+
/** Responsive column counts. */
|
|
974
|
+
columns?: {
|
|
975
|
+
sm?: number;
|
|
976
|
+
md?: number;
|
|
977
|
+
lg?: number;
|
|
978
|
+
};
|
|
979
|
+
/** Text shown when empty. */
|
|
980
|
+
emptyMessage?: string;
|
|
981
|
+
className?: string;
|
|
982
|
+
classNames?: CategoryGridClassNames;
|
|
983
|
+
}
|
|
984
|
+
/**
|
|
985
|
+
* CategoryGrid — responsive grid of category cards.
|
|
986
|
+
*
|
|
987
|
+
* Fetches categories via `useCategories` unless overridden.
|
|
988
|
+
* Uses `React.useId()` for hydration-safe responsive CSS.
|
|
989
|
+
*/
|
|
990
|
+
declare function CategoryGrid({ categories: categoriesProp, onSelect, renderCard, columns, emptyMessage, className, classNames, }: CategoryGridProps): React.ReactElement;
|
|
991
|
+
|
|
992
|
+
interface DealBannerClassNames {
|
|
993
|
+
root?: string;
|
|
994
|
+
item?: string;
|
|
995
|
+
description?: string;
|
|
996
|
+
value?: string;
|
|
997
|
+
badge?: string;
|
|
998
|
+
empty?: string;
|
|
999
|
+
}
|
|
1000
|
+
interface DealBannerProps {
|
|
1001
|
+
/** Override deals (skips useDeals fetch). For SSR, pass pre-fetched deals. */
|
|
1002
|
+
deals?: Deal[];
|
|
1003
|
+
/** Location ID for location-specific deals. */
|
|
1004
|
+
locationId?: string;
|
|
1005
|
+
/** Called when a deal is clicked. */
|
|
1006
|
+
onDealClick?: (deal: Deal) => void;
|
|
1007
|
+
/** Custom deal card renderer. */
|
|
1008
|
+
renderDeal?: (deal: Deal) => React.ReactNode;
|
|
1009
|
+
/** Maximum deals to show. Default: all. */
|
|
1010
|
+
limit?: number;
|
|
1011
|
+
className?: string;
|
|
1012
|
+
classNames?: DealBannerClassNames;
|
|
1013
|
+
}
|
|
1014
|
+
/**
|
|
1015
|
+
* DealBanner — displays active deals/promotions.
|
|
1016
|
+
*
|
|
1017
|
+
* Renders as a horizontal scrollable strip or grid of deal cards.
|
|
1018
|
+
*/
|
|
1019
|
+
declare function DealBanner({ deals: dealsProp, locationId, onDealClick, renderDeal, limit, className, classNames, }: DealBannerProps): React.ReactElement | null;
|
|
1020
|
+
|
|
1021
|
+
interface OrderSummaryClassNames {
|
|
1022
|
+
root?: string;
|
|
1023
|
+
header?: string;
|
|
1024
|
+
orderId?: string;
|
|
1025
|
+
status?: string;
|
|
1026
|
+
items?: string;
|
|
1027
|
+
lineItem?: string;
|
|
1028
|
+
totals?: string;
|
|
1029
|
+
customer?: string;
|
|
1030
|
+
loading?: string;
|
|
1031
|
+
}
|
|
1032
|
+
interface OrderSummaryProps {
|
|
1033
|
+
/** Pass an Order object directly (skips fetch). */
|
|
1034
|
+
order?: Order;
|
|
1035
|
+
/** Or pass an order ID to fetch via useOrder. */
|
|
1036
|
+
orderId?: string;
|
|
1037
|
+
/** Poll for status updates. */
|
|
1038
|
+
poll?: boolean;
|
|
1039
|
+
/** Custom line item renderer. */
|
|
1040
|
+
renderLineItem?: (item: LineItem) => React.ReactNode;
|
|
1041
|
+
className?: string;
|
|
1042
|
+
classNames?: OrderSummaryClassNames;
|
|
1043
|
+
}
|
|
1044
|
+
/**
|
|
1045
|
+
* OrderSummary — displays a single order's details, line items, and totals.
|
|
1046
|
+
*
|
|
1047
|
+
* Accepts either a pre-loaded `order` object or an `orderId` to fetch.
|
|
1048
|
+
* Supports polling for live status updates.
|
|
1049
|
+
*/
|
|
1050
|
+
declare function OrderSummary({ order: orderProp, orderId, poll, renderLineItem, className, classNames, }: OrderSummaryProps): React.ReactElement;
|
|
1051
|
+
|
|
1052
|
+
interface OrderHistoryClassNames {
|
|
1053
|
+
root?: string;
|
|
1054
|
+
item?: string;
|
|
1055
|
+
orderId?: string;
|
|
1056
|
+
status?: string;
|
|
1057
|
+
date?: string;
|
|
1058
|
+
total?: string;
|
|
1059
|
+
empty?: string;
|
|
1060
|
+
loading?: string;
|
|
1061
|
+
}
|
|
1062
|
+
interface OrderHistoryProps {
|
|
1063
|
+
/** Override orders (skips fetch). For SSR, pass pre-fetched orders. */
|
|
1064
|
+
orders?: Order[];
|
|
1065
|
+
/** Filter by status. */
|
|
1066
|
+
status?: OrderStatus;
|
|
1067
|
+
/** Max orders to display. */
|
|
1068
|
+
limit?: number;
|
|
1069
|
+
/** Called when an order row is clicked. */
|
|
1070
|
+
onOrderClick?: (order: Order) => void;
|
|
1071
|
+
/** Custom order row renderer. */
|
|
1072
|
+
renderOrder?: (order: Order) => React.ReactNode;
|
|
1073
|
+
/** Text shown when empty. */
|
|
1074
|
+
emptyMessage?: string;
|
|
1075
|
+
className?: string;
|
|
1076
|
+
classNames?: OrderHistoryClassNames;
|
|
1077
|
+
}
|
|
1078
|
+
/**
|
|
1079
|
+
* OrderHistory — list of past orders with status and totals.
|
|
1080
|
+
*
|
|
1081
|
+
* Fetches via `useOrders` unless pre-loaded orders are passed.
|
|
1082
|
+
*/
|
|
1083
|
+
declare function OrderHistory({ orders: ordersProp, status, limit, onOrderClick, renderOrder, emptyMessage, className, classNames, }: OrderHistoryProps): React.ReactElement;
|
|
1084
|
+
|
|
1085
|
+
interface StoreNavClassNames {
|
|
1086
|
+
root?: string;
|
|
1087
|
+
brand?: string;
|
|
1088
|
+
categories?: string;
|
|
1089
|
+
categoryLink?: string;
|
|
1090
|
+
actions?: string;
|
|
1091
|
+
cartButton?: string;
|
|
1092
|
+
cartCount?: string;
|
|
1093
|
+
searchButton?: string;
|
|
1094
|
+
}
|
|
1095
|
+
interface StoreNavProps {
|
|
1096
|
+
/** Store/brand name. */
|
|
1097
|
+
storeName?: string;
|
|
1098
|
+
/** Custom brand element (logo, etc.). Overrides storeName. */
|
|
1099
|
+
renderBrand?: () => React.ReactNode;
|
|
1100
|
+
/** Override categories (skips fetch). */
|
|
1101
|
+
categories?: Category[];
|
|
1102
|
+
/** Called when a category link is clicked. */
|
|
1103
|
+
onCategoryClick?: (category: Category) => void;
|
|
1104
|
+
/** Called when the cart button is clicked. */
|
|
1105
|
+
onCartClick?: () => void;
|
|
1106
|
+
/** Called when the search button is clicked. */
|
|
1107
|
+
onSearchClick?: () => void;
|
|
1108
|
+
/** Hide category navigation. */
|
|
1109
|
+
hideCategories?: boolean;
|
|
1110
|
+
/** Hide the cart button. */
|
|
1111
|
+
hideCart?: boolean;
|
|
1112
|
+
/** Hide the search button. */
|
|
1113
|
+
hideSearch?: boolean;
|
|
1114
|
+
className?: string;
|
|
1115
|
+
classNames?: StoreNavClassNames;
|
|
1116
|
+
}
|
|
1117
|
+
/**
|
|
1118
|
+
* StoreNav — top navigation bar with brand, category links, cart badge, and search.
|
|
1119
|
+
*
|
|
1120
|
+
* Fetches categories via `useCategories` and cart count via `useCart`.
|
|
1121
|
+
* Renders as a semantic `<nav>` element.
|
|
1122
|
+
*/
|
|
1123
|
+
declare function StoreNav({ storeName, renderBrand, categories: categoriesProp, onCategoryClick, onCartClick, onSearchClick, hideCategories, hideCart, hideSearch, className, classNames, }: StoreNavProps): React.ReactElement;
|
|
1124
|
+
|
|
1125
|
+
interface SlotPickerClassNames {
|
|
1126
|
+
root?: string;
|
|
1127
|
+
group?: string;
|
|
1128
|
+
groupLabel?: string;
|
|
1129
|
+
slot?: string;
|
|
1130
|
+
slotTime?: string;
|
|
1131
|
+
slotPrice?: string;
|
|
1132
|
+
loading?: string;
|
|
1133
|
+
empty?: string;
|
|
1134
|
+
}
|
|
1135
|
+
interface SlotPickerProps {
|
|
1136
|
+
/** Pre-fetched slots (skips fetch). */
|
|
1137
|
+
slots?: AvailableSlot[];
|
|
1138
|
+
/** Service ID — used to fetch slots when `slots` prop is not provided. */
|
|
1139
|
+
serviceId?: string;
|
|
1140
|
+
/** Date string (YYYY-MM-DD) — used to fetch slots when `slots` prop is not provided. */
|
|
1141
|
+
date?: string;
|
|
1142
|
+
/** Number of participants for capacity-based availability. */
|
|
1143
|
+
participantCount?: number;
|
|
1144
|
+
/** Currently selected slot. */
|
|
1145
|
+
selectedSlot?: AvailableSlot | null;
|
|
1146
|
+
/** Called when a slot is selected. */
|
|
1147
|
+
onSlotSelect?: (slot: AvailableSlot) => void;
|
|
1148
|
+
/** Whether to group slots by time of day. Default: true. */
|
|
1149
|
+
groupByTimeOfDay?: boolean;
|
|
1150
|
+
/** Show price on each slot. Default: true. */
|
|
1151
|
+
showPrice?: boolean;
|
|
1152
|
+
/** Text shown when no slots available. */
|
|
1153
|
+
emptyMessage?: string;
|
|
1154
|
+
className?: string;
|
|
1155
|
+
classNames?: SlotPickerClassNames;
|
|
1156
|
+
}
|
|
1157
|
+
declare function SlotPicker({ slots: slotsProp, serviceId, date, participantCount, selectedSlot, onSlotSelect, groupByTimeOfDay, showPrice, emptyMessage, className, classNames, }: SlotPickerProps): React.ReactElement;
|
|
1158
|
+
|
|
1159
|
+
interface DateSlotPickerClassNames {
|
|
1160
|
+
root?: string;
|
|
1161
|
+
dateStrip?: string;
|
|
1162
|
+
dateButton?: string;
|
|
1163
|
+
nav?: string;
|
|
1164
|
+
navButton?: string;
|
|
1165
|
+
slots?: string;
|
|
1166
|
+
loading?: string;
|
|
1167
|
+
}
|
|
1168
|
+
interface DateSlotPickerProps {
|
|
1169
|
+
/** Service ID to fetch availability and slots for. */
|
|
1170
|
+
serviceId: string;
|
|
1171
|
+
/** Number of days to show in the date strip. Default: 7. */
|
|
1172
|
+
daysToShow?: number;
|
|
1173
|
+
/** Number of participants. */
|
|
1174
|
+
participantCount?: number;
|
|
1175
|
+
/** Currently selected slot. */
|
|
1176
|
+
selectedSlot?: AvailableSlot | null;
|
|
1177
|
+
/** Called when a slot is selected. */
|
|
1178
|
+
onSlotSelect?: (slot: AvailableSlot, date: string) => void;
|
|
1179
|
+
/** Pre-fetched availability data (skips fetch). */
|
|
1180
|
+
availability?: DayAvailability[];
|
|
1181
|
+
/** Show price on slots. Default: true. */
|
|
1182
|
+
showPrice?: boolean;
|
|
1183
|
+
className?: string;
|
|
1184
|
+
classNames?: DateSlotPickerClassNames;
|
|
1185
|
+
}
|
|
1186
|
+
declare function DateSlotPicker({ serviceId, daysToShow, participantCount, selectedSlot, onSlotSelect, availability: availabilityProp, showPrice, className, classNames, }: DateSlotPickerProps): React.ReactElement;
|
|
1187
|
+
|
|
1188
|
+
interface StaffPickerClassNames {
|
|
1189
|
+
root?: string;
|
|
1190
|
+
option?: string;
|
|
1191
|
+
avatar?: string;
|
|
1192
|
+
name?: string;
|
|
1193
|
+
bio?: string;
|
|
1194
|
+
}
|
|
1195
|
+
interface StaffPickerProps {
|
|
1196
|
+
/** List of available staff members. */
|
|
1197
|
+
staff: Staff[];
|
|
1198
|
+
/** Currently selected staff ID, or null for "Any available". */
|
|
1199
|
+
selectedStaffId?: string | null;
|
|
1200
|
+
/** Called when a staff member is selected. Passes null for "Any available". */
|
|
1201
|
+
onStaffSelect?: (staffId: string | null) => void;
|
|
1202
|
+
/** Show "Any available" option. Default: true. */
|
|
1203
|
+
showAnyOption?: boolean;
|
|
1204
|
+
/** Label for the "Any available" option. */
|
|
1205
|
+
anyLabel?: string;
|
|
1206
|
+
className?: string;
|
|
1207
|
+
classNames?: StaffPickerClassNames;
|
|
1208
|
+
}
|
|
1209
|
+
declare function StaffPicker({ staff, selectedStaffId, onStaffSelect, showAnyOption, anyLabel, className, classNames, }: StaffPickerProps): React.ReactElement;
|
|
1210
|
+
|
|
1211
|
+
interface BookingCardClassNames {
|
|
1212
|
+
root?: string;
|
|
1213
|
+
service?: string;
|
|
1214
|
+
status?: string;
|
|
1215
|
+
time?: string;
|
|
1216
|
+
confirmationCode?: string;
|
|
1217
|
+
total?: string;
|
|
1218
|
+
actions?: string;
|
|
1219
|
+
cancelButton?: string;
|
|
1220
|
+
rescheduleButton?: string;
|
|
1221
|
+
}
|
|
1222
|
+
interface BookingCardProps {
|
|
1223
|
+
/** The booking to display. */
|
|
1224
|
+
booking: CustomerBooking;
|
|
1225
|
+
/** Called when cancel is clicked. */
|
|
1226
|
+
onCancel?: (booking: CustomerBooking) => void;
|
|
1227
|
+
/** Called when reschedule is clicked. */
|
|
1228
|
+
onReschedule?: (booking: CustomerBooking) => void;
|
|
1229
|
+
/** Custom renderer for the booking. */
|
|
1230
|
+
renderBooking?: (booking: CustomerBooking) => React.ReactNode;
|
|
1231
|
+
className?: string;
|
|
1232
|
+
classNames?: BookingCardClassNames;
|
|
1233
|
+
}
|
|
1234
|
+
declare function BookingCard({ booking, onCancel, onReschedule, renderBooking, className, classNames, }: BookingCardProps): React.ReactElement;
|
|
1235
|
+
|
|
1236
|
+
interface BookingListClassNames {
|
|
1237
|
+
root?: string;
|
|
1238
|
+
item?: string;
|
|
1239
|
+
loading?: string;
|
|
1240
|
+
empty?: string;
|
|
1241
|
+
}
|
|
1242
|
+
interface BookingListProps {
|
|
1243
|
+
/** Pre-fetched bookings (skips fetch). */
|
|
1244
|
+
bookings?: CustomerBooking[];
|
|
1245
|
+
/** Filter: "all", "upcoming", or "past". */
|
|
1246
|
+
filter?: "all" | "upcoming" | "past";
|
|
1247
|
+
/** Called when cancel is clicked on a booking. */
|
|
1248
|
+
onCancel?: (booking: CustomerBooking) => void;
|
|
1249
|
+
/** Called when reschedule is clicked on a booking. */
|
|
1250
|
+
onReschedule?: (booking: CustomerBooking) => void;
|
|
1251
|
+
/** Called when a booking is clicked. */
|
|
1252
|
+
onBookingClick?: (booking: CustomerBooking) => void;
|
|
1253
|
+
/** Custom booking renderer. */
|
|
1254
|
+
renderBooking?: (booking: CustomerBooking) => React.ReactNode;
|
|
1255
|
+
/** Text shown when empty. */
|
|
1256
|
+
emptyMessage?: string;
|
|
1257
|
+
className?: string;
|
|
1258
|
+
classNames?: BookingListClassNames;
|
|
1259
|
+
}
|
|
1260
|
+
declare function BookingList({ bookings: bookingsProp, filter, onCancel, onReschedule, onBookingClick, renderBooking, emptyMessage, className, classNames, }: BookingListProps): React.ReactElement;
|
|
1261
|
+
|
|
1262
|
+
interface ServiceCardClassNames {
|
|
1263
|
+
root?: string;
|
|
1264
|
+
imageContainer?: string;
|
|
1265
|
+
image?: string;
|
|
1266
|
+
body?: string;
|
|
1267
|
+
name?: string;
|
|
1268
|
+
description?: string;
|
|
1269
|
+
meta?: string;
|
|
1270
|
+
duration?: string;
|
|
1271
|
+
price?: string;
|
|
1272
|
+
action?: string;
|
|
1273
|
+
}
|
|
1274
|
+
interface ServiceCardProps {
|
|
1275
|
+
/** The service to display. */
|
|
1276
|
+
service: Service;
|
|
1277
|
+
/** Called when the card or book button is clicked. */
|
|
1278
|
+
onBook?: (service: Service) => void;
|
|
1279
|
+
/** Link href for page mode. Renders as `<a>` instead of `<button>`. */
|
|
1280
|
+
href?: string;
|
|
1281
|
+
/** Label for the action button. Default: "Book". */
|
|
1282
|
+
actionLabel?: string;
|
|
1283
|
+
/** Custom image renderer (e.g. Next.js Image). */
|
|
1284
|
+
renderImage?: (props: {
|
|
1285
|
+
src: string;
|
|
1286
|
+
alt: string;
|
|
1287
|
+
className?: string;
|
|
1288
|
+
}) => React.ReactNode;
|
|
1289
|
+
/** Replace the entire default card body. */
|
|
1290
|
+
children?: React.ReactNode;
|
|
1291
|
+
/** Image aspect ratio. Default: "4/3". */
|
|
1292
|
+
aspectRatio?: "square" | "4/3" | "16/10" | "3/4";
|
|
1293
|
+
className?: string;
|
|
1294
|
+
classNames?: ServiceCardClassNames;
|
|
1295
|
+
}
|
|
1296
|
+
declare function ServiceCard({ service, onBook, href, actionLabel, renderImage, children, aspectRatio, className, classNames, }: ServiceCardProps): React.ReactElement;
|
|
1297
|
+
|
|
1298
|
+
interface ServiceGridClassNames {
|
|
1299
|
+
root?: string;
|
|
1300
|
+
item?: string;
|
|
1301
|
+
empty?: string;
|
|
1302
|
+
loading?: string;
|
|
1303
|
+
}
|
|
1304
|
+
interface ServiceGridProps {
|
|
1305
|
+
/** Pre-fetched services (skips fetch). */
|
|
1306
|
+
services?: Service[];
|
|
1307
|
+
/** Responsive column counts at each breakpoint. */
|
|
1308
|
+
columns?: {
|
|
1309
|
+
sm?: number;
|
|
1310
|
+
md?: number;
|
|
1311
|
+
lg?: number;
|
|
1312
|
+
xl?: number;
|
|
1313
|
+
};
|
|
1314
|
+
/** Called when a service card is clicked. */
|
|
1315
|
+
onServiceSelect?: (service: Service) => void;
|
|
1316
|
+
/** Generate href for each service (renders cards as links). */
|
|
1317
|
+
getServiceHref?: (service: Service) => string;
|
|
1318
|
+
/** Custom card renderer per service. */
|
|
1319
|
+
renderCard?: (service: Service) => React.ReactNode;
|
|
1320
|
+
/** Custom image renderer passed to default ServiceCards. */
|
|
1321
|
+
renderImage?: (props: {
|
|
1322
|
+
src: string;
|
|
1323
|
+
alt: string;
|
|
1324
|
+
className?: string;
|
|
1325
|
+
}) => React.ReactNode;
|
|
1326
|
+
/** Only show available services. Default: true. */
|
|
1327
|
+
availableOnly?: boolean;
|
|
1328
|
+
/** Label for the book action on each card. */
|
|
1329
|
+
actionLabel?: string;
|
|
1330
|
+
/** Text shown when empty. */
|
|
1331
|
+
emptyMessage?: string;
|
|
1332
|
+
className?: string;
|
|
1333
|
+
classNames?: ServiceGridClassNames;
|
|
1334
|
+
}
|
|
1335
|
+
declare function ServiceGrid({ services: servicesProp, columns, onServiceSelect, getServiceHref, renderCard, renderImage, availableOnly, actionLabel, emptyMessage, className, classNames, }: ServiceGridProps): React.ReactElement;
|
|
1336
|
+
|
|
1337
|
+
interface CataloguePageClassNames {
|
|
1338
|
+
root?: string;
|
|
1339
|
+
header?: string;
|
|
1340
|
+
title?: string;
|
|
1341
|
+
searchContainer?: string;
|
|
1342
|
+
filterContainer?: string;
|
|
1343
|
+
gridContainer?: string;
|
|
1344
|
+
empty?: string;
|
|
1345
|
+
loading?: string;
|
|
1346
|
+
}
|
|
1347
|
+
interface CataloguePageProps {
|
|
1348
|
+
/** Page title. */
|
|
1349
|
+
title?: string;
|
|
1350
|
+
/** Pre-fetched products for SSR. When provided, skips client-side fetch. */
|
|
1351
|
+
products?: Product[];
|
|
1352
|
+
/** Pre-fetched categories for SSR. */
|
|
1353
|
+
categories?: Category[];
|
|
1354
|
+
/** Show category filter. Default: true. */
|
|
1355
|
+
showFilter?: boolean;
|
|
1356
|
+
/** Show search input. Default: true. */
|
|
1357
|
+
showSearch?: boolean;
|
|
1358
|
+
/** Called when a product is selected (e.g. navigate to product page). */
|
|
1359
|
+
onProductClick?: (product: Product) => void;
|
|
1360
|
+
/** Called when a category is selected. */
|
|
1361
|
+
onCategoryClick?: (category: Category) => void;
|
|
1362
|
+
/** Custom card renderer passed to ProductGrid. */
|
|
1363
|
+
renderCard?: (product: Product) => React.ReactNode;
|
|
1364
|
+
/** Custom image renderer passed to ProductGrid. */
|
|
1365
|
+
renderImage?: (props: {
|
|
1366
|
+
src: string;
|
|
1367
|
+
alt: string;
|
|
1368
|
+
className?: string;
|
|
1369
|
+
}) => React.ReactNode;
|
|
1370
|
+
/** Grid column config. */
|
|
1371
|
+
columns?: {
|
|
1372
|
+
sm?: number;
|
|
1373
|
+
md?: number;
|
|
1374
|
+
lg?: number;
|
|
1375
|
+
xl?: number;
|
|
1376
|
+
};
|
|
1377
|
+
className?: string;
|
|
1378
|
+
classNames?: CataloguePageClassNames;
|
|
1379
|
+
}
|
|
1380
|
+
/**
|
|
1381
|
+
* CataloguePage — browse all products with category filtering and search.
|
|
1382
|
+
*
|
|
1383
|
+
* SSR-friendly: pass `products` and `categories` props for server rendering.
|
|
1384
|
+
* Omit them for fully client-side data fetching.
|
|
1385
|
+
*/
|
|
1386
|
+
declare function CataloguePage({ title, products: productsProp, categories: categoriesProp, showFilter, showSearch, onProductClick, onCategoryClick, renderCard, renderImage, columns, className, classNames, }: CataloguePageProps): React.ReactElement;
|
|
1387
|
+
|
|
1388
|
+
interface ProductPageClassNames {
|
|
1389
|
+
root?: string;
|
|
1390
|
+
main?: string;
|
|
1391
|
+
badges?: string;
|
|
1392
|
+
relatedSection?: string;
|
|
1393
|
+
relatedTitle?: string;
|
|
1394
|
+
loading?: string;
|
|
1395
|
+
}
|
|
1396
|
+
interface ProductPageProps {
|
|
1397
|
+
/** Product slug or ID to display. */
|
|
1398
|
+
productId: string;
|
|
1399
|
+
/** Pre-fetched product for SSR. Skips client-side fetch when provided. */
|
|
1400
|
+
product?: ProductWithDetails;
|
|
1401
|
+
/** Pre-fetched related products for SSR. */
|
|
1402
|
+
relatedProducts?: Product[];
|
|
1403
|
+
/** Override add-to-cart behavior. */
|
|
1404
|
+
onAddToCart?: (product: ProductWithDetails, quantity: number, options: AddToCartOptions) => void | Promise<void>;
|
|
1405
|
+
/** Custom image renderer (e.g. Next.js Image). */
|
|
1406
|
+
renderImage?: (props: {
|
|
1407
|
+
src: string;
|
|
1408
|
+
alt: string;
|
|
1409
|
+
className?: string;
|
|
1410
|
+
}) => React.ReactNode;
|
|
1411
|
+
/** Show availability badge. Default: true. */
|
|
1412
|
+
showAvailability?: boolean;
|
|
1413
|
+
/** Show sale badge. Default: true. */
|
|
1414
|
+
showSaleBadge?: boolean;
|
|
1415
|
+
/** Show related products section. Default: true. */
|
|
1416
|
+
showRelated?: boolean;
|
|
1417
|
+
/** Related section title. */
|
|
1418
|
+
relatedTitle?: string;
|
|
1419
|
+
className?: string;
|
|
1420
|
+
classNames?: ProductPageClassNames;
|
|
1421
|
+
}
|
|
1422
|
+
/**
|
|
1423
|
+
* ProductPage — full product detail page with badges and related products.
|
|
1424
|
+
*
|
|
1425
|
+
* SSR-friendly: pass `product` prop for server rendering.
|
|
1426
|
+
* Composes ProductSheet, AvailabilityBadge, SaleBadge, and a related products grid.
|
|
1427
|
+
*/
|
|
1428
|
+
declare function ProductPage({ productId, product: productProp, relatedProducts, onAddToCart, renderImage, showAvailability, showSaleBadge, showRelated, relatedTitle, className, classNames, }: ProductPageProps): React.ReactElement;
|
|
1429
|
+
|
|
1430
|
+
interface CartPageClassNames {
|
|
1431
|
+
root?: string;
|
|
1432
|
+
header?: string;
|
|
1433
|
+
title?: string;
|
|
1434
|
+
content?: string;
|
|
1435
|
+
discount?: string;
|
|
1436
|
+
footer?: string;
|
|
1437
|
+
checkoutButton?: string;
|
|
1438
|
+
continueButton?: string;
|
|
1439
|
+
empty?: string;
|
|
1440
|
+
}
|
|
1441
|
+
interface CartPageProps {
|
|
1442
|
+
/** Page title. */
|
|
1443
|
+
title?: string;
|
|
1444
|
+
/** Called when checkout is initiated. */
|
|
1445
|
+
onCheckout?: () => void;
|
|
1446
|
+
/** Called when "continue shopping" is clicked. */
|
|
1447
|
+
onContinueShopping?: () => void;
|
|
1448
|
+
/** Called when a valid discount is applied. */
|
|
1449
|
+
onDiscountApply?: (validation: DiscountValidation) => void;
|
|
1450
|
+
/** Called when discount is removed. */
|
|
1451
|
+
onDiscountClear?: () => void;
|
|
1452
|
+
/** Show discount code input. Default: true. */
|
|
1453
|
+
showDiscount?: boolean;
|
|
1454
|
+
/** Show "continue shopping" link. Default: true. */
|
|
1455
|
+
showContinueShopping?: boolean;
|
|
1456
|
+
/** Checkout button text. */
|
|
1457
|
+
checkoutLabel?: string;
|
|
1458
|
+
className?: string;
|
|
1459
|
+
classNames?: CartPageClassNames;
|
|
1460
|
+
}
|
|
1461
|
+
/**
|
|
1462
|
+
* CartPage — full-page cart view with summary, discount input, and checkout.
|
|
1463
|
+
*
|
|
1464
|
+
* Composes CartSummary and DiscountInput into a complete cart experience.
|
|
1465
|
+
*/
|
|
1466
|
+
declare function CartPage({ title, onCheckout, onContinueShopping, onDiscountApply, onDiscountClear, showDiscount, showContinueShopping, checkoutLabel, className, classNames, }: CartPageProps): React.ReactElement;
|
|
1467
|
+
|
|
1468
|
+
interface CheckoutPageClassNames {
|
|
1469
|
+
root?: string;
|
|
1470
|
+
header?: string;
|
|
1471
|
+
title?: string;
|
|
1472
|
+
checkout?: string;
|
|
1473
|
+
}
|
|
1474
|
+
interface CheckoutPageProps {
|
|
1475
|
+
/** Page title. */
|
|
1476
|
+
title?: string;
|
|
1477
|
+
/** Called after successful checkout. */
|
|
1478
|
+
onComplete: (result: ProcessCheckoutResult) => void;
|
|
1479
|
+
/** Called on checkout failure. */
|
|
1480
|
+
onError?: (error: {
|
|
1481
|
+
code: string;
|
|
1482
|
+
message: string;
|
|
1483
|
+
}) => void;
|
|
1484
|
+
/** Props forwarded to CimplifyCheckout. */
|
|
1485
|
+
checkoutProps?: Partial<Omit<CimplifyCheckoutProps, "client" | "onComplete" | "onError">>;
|
|
1486
|
+
className?: string;
|
|
1487
|
+
classNames?: CheckoutPageClassNames;
|
|
1488
|
+
}
|
|
1489
|
+
/**
|
|
1490
|
+
* CheckoutPage — thin page shell around CimplifyCheckout.
|
|
1491
|
+
*
|
|
1492
|
+
* Reads the CimplifyClient from CimplifyProvider context,
|
|
1493
|
+
* renders a page header, and delegates all checkout logic
|
|
1494
|
+
* to CimplifyCheckout.
|
|
1495
|
+
*/
|
|
1496
|
+
declare function CheckoutPage({ title, onComplete, onError, checkoutProps, className, classNames, }: CheckoutPageProps): React.ReactElement;
|
|
1497
|
+
|
|
1498
|
+
interface CollectionPageClassNames {
|
|
1499
|
+
root?: string;
|
|
1500
|
+
header?: string;
|
|
1501
|
+
title?: string;
|
|
1502
|
+
description?: string;
|
|
1503
|
+
image?: string;
|
|
1504
|
+
grid?: string;
|
|
1505
|
+
loading?: string;
|
|
1506
|
+
}
|
|
1507
|
+
interface CollectionPageProps {
|
|
1508
|
+
/** Collection slug or ID. */
|
|
1509
|
+
collectionId: string;
|
|
1510
|
+
/** Pre-fetched collection for SSR. */
|
|
1511
|
+
collection?: Collection;
|
|
1512
|
+
/** Pre-fetched products for SSR. */
|
|
1513
|
+
products?: Product[];
|
|
1514
|
+
/** Custom card renderer. */
|
|
1515
|
+
renderCard?: (product: Product) => React.ReactNode;
|
|
1516
|
+
/** Custom image renderer. */
|
|
1517
|
+
renderImage?: (props: {
|
|
1518
|
+
src: string;
|
|
1519
|
+
alt: string;
|
|
1520
|
+
className?: string;
|
|
1521
|
+
}) => React.ReactNode;
|
|
1522
|
+
/** Grid column config. */
|
|
1523
|
+
columns?: {
|
|
1524
|
+
sm?: number;
|
|
1525
|
+
md?: number;
|
|
1526
|
+
lg?: number;
|
|
1527
|
+
xl?: number;
|
|
1528
|
+
};
|
|
1529
|
+
className?: string;
|
|
1530
|
+
classNames?: CollectionPageClassNames;
|
|
1531
|
+
}
|
|
1532
|
+
/**
|
|
1533
|
+
* CollectionPage — curated product collection with header and grid.
|
|
1534
|
+
*
|
|
1535
|
+
* SSR-friendly: pass `collection` and `products` props for server rendering.
|
|
1536
|
+
*/
|
|
1537
|
+
declare function CollectionPage({ collectionId, collection: collectionProp, products: productsProp, renderCard, renderImage, columns, className, classNames, }: CollectionPageProps): React.ReactElement;
|
|
1538
|
+
|
|
1539
|
+
interface OrderDetailPageClassNames {
|
|
1540
|
+
root?: string;
|
|
1541
|
+
header?: string;
|
|
1542
|
+
title?: string;
|
|
1543
|
+
backButton?: string;
|
|
1544
|
+
summary?: string;
|
|
1545
|
+
}
|
|
1546
|
+
interface OrderDetailPageProps {
|
|
1547
|
+
/** Order ID to display. */
|
|
1548
|
+
orderId: string;
|
|
1549
|
+
/** Pre-fetched order for SSR. */
|
|
1550
|
+
order?: Order;
|
|
1551
|
+
/** Poll for status updates. Default: true. */
|
|
1552
|
+
poll?: boolean;
|
|
1553
|
+
/** Called when back button is clicked. */
|
|
1554
|
+
onBack?: () => void;
|
|
1555
|
+
/** Custom line item renderer. */
|
|
1556
|
+
renderLineItem?: (item: LineItem) => React.ReactNode;
|
|
1557
|
+
/** Back button label. */
|
|
1558
|
+
backLabel?: string;
|
|
1559
|
+
className?: string;
|
|
1560
|
+
classNames?: OrderDetailPageClassNames;
|
|
1561
|
+
}
|
|
1562
|
+
/**
|
|
1563
|
+
* OrderDetailPage — single order detail view with live status polling.
|
|
1564
|
+
*
|
|
1565
|
+
* SSR-friendly: pass `order` prop for server rendering.
|
|
1566
|
+
*/
|
|
1567
|
+
declare function OrderDetailPage({ orderId, order, poll, onBack, renderLineItem, backLabel, className, classNames, }: OrderDetailPageProps): React.ReactElement;
|
|
1568
|
+
|
|
1569
|
+
interface OrderHistoryPageClassNames {
|
|
1570
|
+
root?: string;
|
|
1571
|
+
header?: string;
|
|
1572
|
+
title?: string;
|
|
1573
|
+
filters?: string;
|
|
1574
|
+
filterButton?: string;
|
|
1575
|
+
list?: string;
|
|
1576
|
+
detail?: string;
|
|
1577
|
+
backButton?: string;
|
|
1578
|
+
}
|
|
1579
|
+
interface OrderHistoryPageProps {
|
|
1580
|
+
/** Page title. */
|
|
1581
|
+
title?: string;
|
|
1582
|
+
/** Pre-fetched orders for SSR. */
|
|
1583
|
+
orders?: Order[];
|
|
1584
|
+
/** Max orders to show per page. */
|
|
1585
|
+
limit?: number;
|
|
1586
|
+
/** Called when navigating to an order detail (e.g. for routing). */
|
|
1587
|
+
onOrderNavigate?: (order: Order) => void;
|
|
1588
|
+
/** Show status filter tabs. Default: true. */
|
|
1589
|
+
showFilters?: boolean;
|
|
1590
|
+
/** Custom order row renderer. */
|
|
1591
|
+
renderOrder?: (order: Order) => React.ReactNode;
|
|
1592
|
+
className?: string;
|
|
1593
|
+
classNames?: OrderHistoryPageClassNames;
|
|
1594
|
+
}
|
|
1595
|
+
/**
|
|
1596
|
+
* OrderHistoryPage — order list with inline detail view and status filtering.
|
|
1597
|
+
*
|
|
1598
|
+
* SSR-friendly: pass `orders` prop for server rendering.
|
|
1599
|
+
* Supports both inline detail view and external navigation via `onOrderNavigate`.
|
|
1600
|
+
*/
|
|
1601
|
+
declare function OrderHistoryPage({ title, orders: ordersProp, limit, onOrderNavigate, showFilters, renderOrder, className, classNames, }: OrderHistoryPageProps): React.ReactElement;
|
|
1602
|
+
|
|
1603
|
+
interface SearchPageClassNames {
|
|
1604
|
+
root?: string;
|
|
1605
|
+
header?: string;
|
|
1606
|
+
title?: string;
|
|
1607
|
+
inputContainer?: string;
|
|
1608
|
+
input?: string;
|
|
1609
|
+
clearButton?: string;
|
|
1610
|
+
resultCount?: string;
|
|
1611
|
+
grid?: string;
|
|
1612
|
+
empty?: string;
|
|
1613
|
+
loading?: string;
|
|
1614
|
+
}
|
|
1615
|
+
interface SearchPageProps {
|
|
1616
|
+
/** Page title. */
|
|
1617
|
+
title?: string;
|
|
1618
|
+
/** Placeholder text. */
|
|
1619
|
+
placeholder?: string;
|
|
1620
|
+
/** Called when a product is clicked in results. */
|
|
1621
|
+
onProductClick?: (product: Product) => void;
|
|
1622
|
+
/** Custom card renderer. */
|
|
1623
|
+
renderCard?: (product: Product) => React.ReactNode;
|
|
1624
|
+
/** Custom image renderer. */
|
|
1625
|
+
renderImage?: (props: {
|
|
1626
|
+
src: string;
|
|
1627
|
+
alt: string;
|
|
1628
|
+
className?: string;
|
|
1629
|
+
}) => React.ReactNode;
|
|
1630
|
+
/** Grid column config. */
|
|
1631
|
+
columns?: {
|
|
1632
|
+
sm?: number;
|
|
1633
|
+
md?: number;
|
|
1634
|
+
lg?: number;
|
|
1635
|
+
xl?: number;
|
|
1636
|
+
};
|
|
1637
|
+
className?: string;
|
|
1638
|
+
classNames?: SearchPageClassNames;
|
|
1639
|
+
}
|
|
1640
|
+
/**
|
|
1641
|
+
* SearchPage — dedicated search page with input and results grid.
|
|
1642
|
+
*
|
|
1643
|
+
* Uses `useSearch` for debounced full-text search.
|
|
1644
|
+
*/
|
|
1645
|
+
declare function SearchPage({ title, placeholder, onProductClick, renderCard, renderImage, columns, className, classNames, }: SearchPageProps): React.ReactElement;
|
|
1646
|
+
|
|
1647
|
+
interface DealsPageClassNames {
|
|
1648
|
+
root?: string;
|
|
1649
|
+
header?: string;
|
|
1650
|
+
title?: string;
|
|
1651
|
+
bannerSection?: string;
|
|
1652
|
+
productsSection?: string;
|
|
1653
|
+
productsTitle?: string;
|
|
1654
|
+
empty?: string;
|
|
1655
|
+
loading?: string;
|
|
1656
|
+
}
|
|
1657
|
+
interface DealsPageProps {
|
|
1658
|
+
/** Page title. */
|
|
1659
|
+
title?: string;
|
|
1660
|
+
/** Pre-fetched deals for SSR. */
|
|
1661
|
+
deals?: Deal[];
|
|
1662
|
+
/** Pre-fetched products on sale for SSR. */
|
|
1663
|
+
productsOnSale?: ProductDealInfo[];
|
|
1664
|
+
/** Pre-fetched product objects for rendering. */
|
|
1665
|
+
products?: Product[];
|
|
1666
|
+
/** Location ID for location-specific deals. */
|
|
1667
|
+
locationId?: string;
|
|
1668
|
+
/** Custom image renderer. */
|
|
1669
|
+
renderImage?: (props: {
|
|
1670
|
+
src: string;
|
|
1671
|
+
alt: string;
|
|
1672
|
+
className?: string;
|
|
1673
|
+
}) => React.ReactNode;
|
|
1674
|
+
/** Grid column config. */
|
|
1675
|
+
columns?: {
|
|
1676
|
+
sm?: number;
|
|
1677
|
+
md?: number;
|
|
1678
|
+
lg?: number;
|
|
1679
|
+
xl?: number;
|
|
1680
|
+
};
|
|
1681
|
+
className?: string;
|
|
1682
|
+
classNames?: DealsPageClassNames;
|
|
1683
|
+
}
|
|
1684
|
+
/**
|
|
1685
|
+
* DealsPage — promotions landing page with deal banners and on-sale products.
|
|
1686
|
+
*
|
|
1687
|
+
* SSR-friendly: pass `deals` and `productsOnSale` props for server rendering.
|
|
1688
|
+
*/
|
|
1689
|
+
declare function DealsPage({ title, deals: dealsProp, productsOnSale: productsOnSaleProp, products: productsProp, locationId, renderImage, columns, className, classNames, }: DealsPageProps): React.ReactElement;
|
|
1690
|
+
|
|
1691
|
+
interface BookingPageClassNames {
|
|
1692
|
+
root?: string;
|
|
1693
|
+
header?: string;
|
|
1694
|
+
title?: string;
|
|
1695
|
+
serviceInfo?: string;
|
|
1696
|
+
step?: string;
|
|
1697
|
+
stepTitle?: string;
|
|
1698
|
+
summary?: string;
|
|
1699
|
+
summaryRow?: string;
|
|
1700
|
+
confirmButton?: string;
|
|
1701
|
+
backButton?: string;
|
|
1702
|
+
error?: string;
|
|
1703
|
+
}
|
|
1704
|
+
interface BookingPageProps {
|
|
1705
|
+
/** The service being booked. */
|
|
1706
|
+
service: Service;
|
|
1707
|
+
/** Optional staff list for staff selection step. */
|
|
1708
|
+
staff?: Staff[];
|
|
1709
|
+
/** Number of participants. */
|
|
1710
|
+
participantCount?: number;
|
|
1711
|
+
/** Page title. */
|
|
1712
|
+
title?: string;
|
|
1713
|
+
/** Called after successfully adding to cart. */
|
|
1714
|
+
onBooked?: (slot: AvailableSlot, staffId: string | null) => void;
|
|
1715
|
+
/** Called when user wants to go back. */
|
|
1716
|
+
onBack?: () => void;
|
|
1717
|
+
/** Show price on slots. Default: true. */
|
|
1718
|
+
showPrice?: boolean;
|
|
1719
|
+
className?: string;
|
|
1720
|
+
classNames?: BookingPageClassNames;
|
|
1721
|
+
}
|
|
1722
|
+
declare function BookingPage({ service, staff, participantCount, title, onBooked, onBack, showPrice, className, classNames, }: BookingPageProps): React.ReactElement;
|
|
1723
|
+
|
|
1724
|
+
interface BookingsPageClassNames {
|
|
1725
|
+
root?: string;
|
|
1726
|
+
header?: string;
|
|
1727
|
+
title?: string;
|
|
1728
|
+
filters?: string;
|
|
1729
|
+
filterButton?: string;
|
|
1730
|
+
list?: string;
|
|
1731
|
+
detail?: string;
|
|
1732
|
+
backButton?: string;
|
|
1733
|
+
}
|
|
1734
|
+
interface BookingsPageProps {
|
|
1735
|
+
/** Page title. */
|
|
1736
|
+
title?: string;
|
|
1737
|
+
/** Pre-fetched bookings for SSR. */
|
|
1738
|
+
bookings?: CustomerBooking[];
|
|
1739
|
+
/** Called when navigating to a booking detail (e.g. for routing). */
|
|
1740
|
+
onBookingNavigate?: (booking: CustomerBooking) => void;
|
|
1741
|
+
/** Called when cancel is clicked. */
|
|
1742
|
+
onCancel?: (booking: CustomerBooking) => void;
|
|
1743
|
+
/** Called when reschedule is clicked. */
|
|
1744
|
+
onReschedule?: (booking: CustomerBooking) => void;
|
|
1745
|
+
/** Show filter tabs. Default: true. */
|
|
1746
|
+
showFilters?: boolean;
|
|
1747
|
+
/** Custom booking renderer. */
|
|
1748
|
+
renderBooking?: (booking: CustomerBooking) => React.ReactNode;
|
|
1749
|
+
className?: string;
|
|
1750
|
+
classNames?: BookingsPageClassNames;
|
|
1751
|
+
}
|
|
1752
|
+
declare function BookingsPage({ title, bookings: bookingsProp, onBookingNavigate, onCancel, onReschedule, showFilters, renderBooking, className, classNames, }: BookingsPageProps): React.ReactElement;
|
|
1753
|
+
|
|
1754
|
+
export { Ad, AdPosition, type AdProps, AdProvider, AdSlot, AddOnSelector, type AddOnSelectorProps, type AddToCartOptions, AddressElement, AuthElement, AvailabilityBadge, type AvailabilityBadgeClassNames, type AvailabilityBadgeProps, BookingCard, type BookingCardClassNames, type BookingCardProps, BookingList, type BookingListClassNames, type BookingListProps, BookingPage, type BookingPageClassNames, type BookingPageProps, BookingsPage, type BookingsPageClassNames, type BookingsPageProps, BundleSelector, type BundleSelectorProps, CartPage, type CartPageClassNames, type CartPageProps, CartSummary, type CartSummaryProps, CataloguePage, type CataloguePageClassNames, type CataloguePageProps, CategoryFilter, type CategoryFilterClassNames, type CategoryFilterProps, CategoryGrid, type CategoryGridClassNames, type CategoryGridProps, CheckoutPage, type CheckoutPageClassNames, type CheckoutPageProps, CimplifyCheckout, type CimplifyCheckoutProps, type CimplifyContextValue, CimplifyProvider, type CimplifyProviderProps, CollectionPage, type CollectionPageClassNames, type CollectionPageProps, CompositeSelector, type CompositeSelectorProps, DateSlotPicker, type DateSlotPickerClassNames, type DateSlotPickerProps, DealBanner, type DealBannerClassNames, type DealBannerProps, DealsPage, type DealsPageClassNames, type DealsPageProps, DiscountInput, type DiscountInputClassNames, type DiscountInputProps, ElementsProvider, OrderDetailPage, type OrderDetailPageClassNames, type OrderDetailPageProps, OrderHistory, type OrderHistoryClassNames, OrderHistoryPage, type OrderHistoryPageClassNames, type OrderHistoryPageProps, type OrderHistoryProps, OrderSummary, type OrderSummaryClassNames, type OrderSummaryProps, PaymentElement, Price, type PriceProps, ProductCard, type ProductCardClassNames, type ProductCardProps, ProductCustomizer, type ProductCustomizerProps, ProductGrid, type ProductGridClassNames, type ProductGridProps, ProductImageGallery, type ProductImageGalleryProps, ProductPage, type ProductPageClassNames, type ProductPageProps, ProductSheet, type ProductSheetClassNames, type ProductSheetProps, QuantitySelector, type QuantitySelectorProps, SaleBadge, type SaleBadgeClassNames, type SaleBadgeProps, SearchInput, type SearchInputClassNames, type SearchInputProps, SearchPage, type SearchPageClassNames, type SearchPageProps, ServiceCard, type ServiceCardClassNames, type ServiceCardProps, ServiceGrid, type ServiceGridClassNames, type ServiceGridProps, SlotPicker, type SlotPickerClassNames, type SlotPickerProps, StaffPicker, type StaffPickerClassNames, type StaffPickerProps, StoreNav, type StoreNavClassNames, type StoreNavProps, type UseAvailableSlotsOptions, type UseAvailableSlotsResult, type UseBookingsOptions, type UseBookingsResult, type UseBundlesOptions, type UseBundlesResult, type UseCartItem, type UseCartOptions, type UseCartResult, type UseCategoriesOptions, type UseCategoriesResult, type UseCollectionOptions, type UseCollectionResult, type UseCollectionsOptions, type UseCollectionsResult, type UseDealsOptions, type UseDealsResult, type UseLocationsOptions, type UseLocationsResult, type UseOrderOptions, type UseOrderResult, type UseOrdersOptions, type UseOrdersResult, type UseProductAvailabilityOptions, type UseProductAvailabilityResult, type UseProductDealsOptions, type UseProductDealsResult, type UseProductOptions, type UseProductPriceInput, type UseProductPriceResult, type UseProductResult, type UseProductSchedulesOptions, type UseProductSchedulesResult, type UseProductsOnSaleOptions, type UseProductsOnSaleResult, type UseProductsOptions, type UseProductsResult, type UseQuoteInput, type UseQuoteOptions, type UseQuoteResult, type UseSearchOptions, type UseSearchResult, type UseServiceAvailabilityOptions, type UseServiceAvailabilityResult, type UseServicesOptions, type UseServicesResult, type UseTaxonomiesOptions, type UseTaxonomiesResult, type UseTaxonomyOptions, type UseTaxonomyPathOptions, type UseTaxonomyPathResult, type UseTaxonomyResult, type UseValidateDiscountOptions, type UseValidateDiscountResult, VariantSelector, type VariantSelectorProps, cn, useAds, useAvailableSlots, useBookings, useBundles, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useDeals, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useOrders, useProduct, useProductAvailability, useProductDeals, useProductPrice, useProductSchedules, useProducts, useProductsOnSale, useQuote, useSearch, useServiceAvailability, useServices, useTaxonomies, useTaxonomy, useTaxonomyPath, useValidateDiscount };
|