---
title: ProductVariantComponentConnection - Storefront API
description: >
  An auto-generated type for paginating through multiple
  ProductVariantComponents.
api_version: 2026-01
api_name: storefront
type: connection
api_type: graphql
source_url:
  html: >-
    https://shopify.dev/docs/api/storefront/latest/connections/ProductVariantComponentConnection
  md: >-
    https://shopify.dev/docs/api/storefront/latest/connections/ProductVariantComponentConnection.md
---

# Product​Variant​Component​Connection

connection

An auto-generated type for paginating through multiple ProductVariantComponents.

## Fields with this connection

* [Product​Variant.components](https://shopify.dev/docs/api/storefront/latest/objects/ProductVariant#field-ProductVariant.fields.components)

  OBJECT

  A specific version of a [product](https://shopify.dev/docs/api/storefront/current/objects/Product) available for sale, differentiated by options like size or color. For example, a small blue t-shirt and a large blue t-shirt are separate variants of the same product. For more information, see the docs on [Shopify's product model](https://shopify.dev/docs/apps/build/product-merchandising/products-and-collections).

  For products with quantity rules, variants enforce minimum, maximum, and increment constraints on purchases.

  Variants also support subscriptions and pre-orders through [selling plan allocations](https://shopify.dev/docs/api/storefront/current/objects/SellingPlanAllocation) objects, bundle configurations through [product variant components](https://shopify.dev/docs/api/storefront/current/objects/ProductVariantComponent) objects, and [shop pay installments pricing](https://shopify.dev/docs/api/storefront/current/objects/ShopPayInstallmentsPricing) for flexible payment options.

***

## Possible returns

* edges

  [\[Product​Variant​Component​Edge!\]!](https://shopify.dev/docs/api/storefront/latest/objects/ProductVariantComponentEdge)

  non-null

  A list of edges.

* nodes

  [\[Product​Variant​Component!\]!](https://shopify.dev/docs/api/storefront/latest/objects/ProductVariantComponent)

  non-null

  A list of the nodes contained in ProductVariantComponentEdge.

* page​Info

  [Page​Info!](https://shopify.dev/docs/api/storefront/latest/objects/PageInfo)

  non-null

  Information to aid in pagination.

***

## Map

### Fields with this connection

* [Product​Variant.components](https://shopify.dev/docs/api/storefront/latest/objects/ProductVariant#field-ProductVariant.fields.components)

### Possible returns

* [Product​Variant​Component​Connection.edges](https://shopify.dev/docs/api/storefront/latest/connections/ProductVariantComponentConnection#returns-edges)
* [Product​Variant​Component​Connection.nodes](https://shopify.dev/docs/api/storefront/latest/connections/ProductVariantComponentConnection#returns-nodes)
* [Product​Variant​Component​Connection.pageInfo](https://shopify.dev/docs/api/storefront/latest/connections/ProductVariantComponentConnection#returns-pageInfo)