Comparisons

Side-by-side product comparison for an 86d storefront. Customers add up to four products and see attribute, price, and inventory differences in one view.

The comparisons module powers a “compare products” feature on the storefront. Customers select up to four products and see a side-by-side table of attributes, price, inventory, and ratings. State persists per browser; signed-in customers can save a comparison set.

Source: modules/comparisons · npm: @86d-app/comparisons

Installation

86d module add comparisons

Configuration

comparisons({
  maxItems: "4",
});

Components

• <CompareButton productId={id} />: per-product “Add to compare” toggle.
• <CompareDrawer />: floating drawer showing currently selected items.
• <ComparePage />: full side-by-side comparison view.

Related modules

• Products: the catalog being compared.
• Reviews: rating column in the comparison view.