Product Bundle Builder
The main component that combines all other components to create a complete product bundle builder.
Component Preview
The ProductBundleBuilder is a complex component that combines all the other components. For a full interactive preview, please visit the Example page.
Product Bundle Builder
Complete product bundle builder with all components
Universal Container
Multifunctional container with customization options to suit your needs
Shipping Information
Delivery Instructions
Select how you want the container doors positioned during delivery:
Your Container Bundle
Universal Container
Base product
$1200
Medium
Size
+$300
White
Color
Included
Total Price:
Usage
The ProductBundleBuilder is the main component that combines all other components to create a complete product bundle builder. It manages the state of selected options, shipping information, and delivery preferences, and calculates the total price.
Props
product- The base product objectmodificationGroups- Array of modification groupswarehouses- Array of warehouse objects for shipping calculationonAddToCart- Function called when the Add to Cart button is clicked
Component Structure
The ProductBundleBuilder is composed of the following components:
- Product information display
- ModificationGroup components for each group of options
- ShippingCalculator for calculating shipping costs
- DeliveryInstructions for selecting delivery preferences
- CartSummary for displaying the selected options and total price