Skip to content

Latest commit

 

History

History
68 lines (47 loc) · 4.15 KB

ProductSpecifications.md

File metadata and controls

68 lines (47 loc) · 4.15 KB

Product Specifications

Description

ProductSpecifications is a VTEX component that shows the technical specifications of a product. This component is meant to be used inside the store.product block and consume data from the product-context.

📢 Disclaimer: Don't fork this project, use, contribute, or open issue with your feature request.

Table of Contents

Usage

You should follow the usage instruction in the main README.

Just add this component to your store.product block:

"store.product": {
  "children": ["product-specifications"]
}

Blocks API

When implementing this component as a block, various inner blocks may be available. The following interface lists the available blocks within ProductSpecifications and describes if they are required or optional.

 "product-specifications":{
   "component": "ProductSpecifications"
 }

For now this block does not have any required or optional blocks.

Configuration

Through the Storefront, you can change the ProductSpecifications's behavior and interface. However, you also can make in your theme app, as Store theme does.

Prop name Type Description Default value
hiddenSpecifications String[] Type names of specifications you want to hide []
visibleSpecifications String[] Type names of specifications you want to appear. Only provide one of hiddenSpecifications or visibleSpecifications []
showSpecificationsTab Boolean Choose if you want to show the component with tabs mode false
shoudCollapseOnTabChange Boolean If it should collapse if you change the tab false
collapsible mobileOnly|desktopOnly|always|never Control when should the content of the specifications be collapsible always

Styles API

You should follow the Styles API instruction in the main README.

CSS Namespaces

Below, we describe the namespace that are defined in the ProductSpecifications.

Class name Description Component Source
specificationsTitle The title of the specifications section index
specificationsTableContainer The main container of the product specifications in table view including the specificationsTable and the specificationTitle index
specificationsTable The table of specifications index
specificationsTabsContainer The main container of the product specifications in tabs view including the specificationsTable and the specificationTitle index
specificationsTab The content inside a tab of the product index