Unknown Component

Received request from Uniform to render a component with the public ID: pdp.

<UniformComposition /> does not have pdp mapped to a React component yet.

To teach your app how to render this component:

• Create a React component and register it with Uniform, for example

  function Pdp({ slug }) {
    return (
      <div>
        Pdp!
        <UniformSlot name="content" />
      </div>
    )
  }
  
  registerUniformComponent({ type: "pdp", component: Pdp })

  Props that your React component will receive

  {
    "slug": "hardie-plank-lap-siding",
    "component": {
      "type": "pdp",
      "_pattern": "46b771f9-cb9d-47a1-a8d8-65f160d6948e",
      "parameters": {
        "slug": {
          "type": "text",
          "value": "hardie-plank-lap-siding"
        }
      },
      "slots": {
        "content": [
          {
            "type": "headlineLocation",
            "parameters": {
              "theme": {
                "type": "select",
                "value": "secondary"
              },
              "title": {
                "type": "text",
                "value": "Hardie® Plank Lap Siding"
              },
              "isHeader": {
                "type": "checkbox",
                "value": true
              },
              "subtitle": {
                "type": "text",
                "value": "Protect and transform your home with our best-selling product line from the #1 brand of fiber cement siding in North America*, available in stunning finishes to suit every style."
              },
              "hasLocation": {
                "type": "checkbox",
                "value": true
              },
              "headerDirection": {
                "type": "select",
                "value": "row"
              }
            }
          },
          {
            "type": "productDetail",
            "parameters": {
              "ctaUrl": {
                "type": "link",
                "value": {
                  "path": "/hover-design-visualization",
                  "type": "url"
                }
              },
              "ctaTitle": {
                "type": "text",
                "value": "Visualize with Hover®"
              },
              "colorTitle": {
                "type": "text",
                "value": "Select a color"
              },
              "notFoundText": {
                "type": "json",
                "value": {
                  "nodeType": "paragraph",
                  "data": {},
                  "content": [
                    {
                      "nodeType": "text",
                      "value": "No colors found.",
                      "marks": [],
                      "data": {}
                    }
                  ]
                }
              },
              "familiesTitle": {
                "type": "text",
                "value": "Select color"
              },
              "variantsTitle": {
                "type": "text",
                "value": "Select your siding texture"
              },
              "freeSampleText": {
                "type": "text",
                "value": "Free"
              },
              "inputHelperText": {
                "type": "text",
                "value": "Search by color name. E.g. \"Linden Green"
              },
              "collectionsTitle": {
                "type": "text",
                "value": "Select your color collection"
              },
              "colorsDisclaimer": {
                "type": "json",
                "value": {
                  "nodeType": "paragraph",
                  "data": {},
                  "content": [
                    {
                      "nodeType": "text",
                      "value": "Made specifically for you, products may incur additional cost and production time.",
                      "marks": [],
                      "data": {}
                    }
                  ]
                }
              },
              "inputPlaceholder": {
                "type": "text",
                "value": "Find colors by name"
              },
              "addToCartCtaTitle": {
                "type": "text",
                "value": "Add sample to cart |"
              },
              "clearFilterLabelText": {
                "type": "text",
                "value": "Clear color filter"
              }
            }
          },
          {
            "type": "valuePropositionsContainer",
            "slots": {
              "content": [
                {
                  "type": "valuePropositionsCard",
                  "parameters": {
                    "body": {
                      "type": "json",
                      "value": {
                        "nodeType": "document",
                        "data": {},
                        "content": [
                          {
                            "nodeType": "heading-3",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Superior durability",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          },
                          {
                            "nodeType": "paragraph",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Hardie® siding is noncombustible—it will not burn.** It resists damage from moisture and holds no appeal for pests like woodpeckers or termites. ",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          }
                        ]
                      }
                    },
                    "icon": {
                      "type": "select",
                      "value": "durable"
                    },
                    "name": {
                      "type": "text",
                      "value": "Superior durability"
                    }
                  }
                },
                {
                  "type": "valuePropositionsCard",
                  "parameters": {
                    "body": {
                      "type": "json",
                      "value": {
                        "nodeType": "document",
                        "data": {},
                        "content": [
                          {
                            "nodeType": "heading-3",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Engineered for Climate®",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          },
                          {
                            "nodeType": "paragraph",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Our fiber cement siding and trim products are formulated to offer superior performance based on your region's unique climate needs, and help protect against damage from weather extremes, hurricanes, winter storms and more. ",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          }
                        ]
                      }
                    },
                    "icon": {
                      "type": "select",
                      "value": "weather-umbrella"
                    },
                    "name": {
                      "type": "text",
                      "value": "Engineered for Climate®"
                    }
                  }
                },
                {
                  "type": "valuePropositionsCard",
                  "parameters": {
                    "body": {
                      "type": "json",
                      "value": {
                        "nodeType": "document",
                        "data": {},
                        "content": [
                          {
                            "nodeType": "heading-3",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Lasting value",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          },
                          {
                            "nodeType": "paragraph",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Enjoy a low-maintenance exterior with a 30-year non-prorated limited, transferrable substrate warranty for lasting peace of mind and quality you can trust. ",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          }
                        ]
                      }
                    },
                    "icon": {
                      "type": "select",
                      "value": "house-heart"
                    },
                    "name": {
                      "type": "text",
                      "value": "Lasting value"
                    }
                  }
                }
              ],
              "sectionHeader": [
                {
                  "type": "sectionHeader",
                  "variant": "thin",
                  "parameters": {
                    "body": {
                      "type": "text",
                      "value": "Hardie® siding does more than transform your home's look—it helps protect your home for decades to come."
                    },
                    "theme": {
                      "type": "select",
                      "value": "transparent"
                    },
                    "title": {
                      "type": "text",
                      "value": "Why Choose Hardie® Plank? "
                    }
                  }
                }
              ]
            },
            "parameters": {
              "theme": {
                "type": "select",
                "value": "neutral"
              }
            }
          },
          {
            "type": "textImage",
            "slots": {
              "items": [
                {
                  "type": "textImageItem",
                  "parameters": {
                    "image": {
                      "type": "image",
                      "value": "//images.ctfassets.net/dzi2asncd44t/43FO7z6YJdd4KlhZ0oLeO/d74cb854fd729557e71a67e1b3665e2f/closeup-house-hardie-plank-hardie-shingle-hardie-trim-evening-blue_pdp.jpg"
                    },
                    "bodyCopy": {
                      "type": "text",
                      "value": "ColorPlus® Technology finishes provide countless color options in an ultra-durable finish. Our factory-applied, baked-on color is cured between coats for superior color consistency, adhesion and durability."
                    },
                    "headline": {
                      "type": "text",
                      "value": "Create unmatched curb appeal "
                    }
                  }
                }
              ]
            },
            "parameters": {
              "ctasText": {
                "type": "text",
                "value": " "
              },
              "startPosition": {
                "type": "select",
                "value": "right"
              }
            }
          },
          {
            "type": "productSpecs",
            "parameters": {
              "cta2Link": {
                "type": "link",
                "value": {
                  "path": "/installation-instructions-technical-docs",
                  "type": "projectMapNode",
                  "nodeId": "fe1fde08-dcbd-4304-aff6-649137fd6efe",
                  "projectMapId": "c350da3c-fcaf-49a5-9b94-1a73ef3408f9"
                }
              },
              "cta2Text": {
                "type": "text",
                "value": "Download tech docs"
              },
              "headline": {
                "type": "text",
                "value": "Tech specs and documents"
              },
              "supporting": {
                "type": "text",
                "value": "Learn everything you need to know about installing and caring for Hardie® Plank. "
              }
            }
          },
          {
            "type": "carousel",
            "slots": {
              "containerInner": [
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/7n6DlOOYVqACbYLuZNLqxk/98c76ef0df456de85a24f763b6ebebb9/product-wall-magnolia-hardie-panel-battens-last-embers.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Panel"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/exterior-siding-products/hardie-panel-siding",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/3TG3VbtvMFE5PLEU6GXW06/2993f54d130b21d9917dbd61ce6d0204/product-detail-magnolia-hardie-shingle-its-about-thyme.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Shingle"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/exterior-siding-products/hardie-shingle-siding",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/mKm0AfUXauM6ZaS1EIUG9/e01181eb6721d3369481738cda9652eb/detail-hardie-soffit-panel-arctic-white-hardie-plank-deep-ocean.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Soffit"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/soffit-products/hardie-soffit-panels",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/320GJgmBcDrqlxNSYLGeR3/cca1b9095adee18330ecf77203312087/detail-hardie-plank-hardie-batten-white.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Trim Batten Boards"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/trim-products/hardie-trim-batten-boards",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/4b43vUbPYcEFzlHo60nWI9/cd9d3b097173815a3a2f52f871ebdc6c/detail-hardie-architectural-panel-smooth-sand-gray.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Architectural Panel"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/exterior-siding-products/hardie-architectural-panel-siding",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/ZDPuEgi2xOQPXnoasj83G/2ae130588ae85201d00c79b5ac92fc31/detail-hardie-artisan-vgroove-siding-white.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Artisan Siding"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/exterior-siding-products/hardie-artisan-siding",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/5d0eEXlnevwnD5Zt6eANii/99d78736e0c68212ffc9ace2491e0ad3/hardie-weather-barrier.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie™ Weather Barrier"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/moisture-management-products/weather-barrier-products",
                        "type": "url"
                      }
                    }
                  }
                },
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/158cDUksZP4o3lWCXOUFSn/39d96963ba921dd98fa55cddd907a2e7/pdp-hero-using-hardie-colorplus-touch-up-kit.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "ColorPlus® Technology Touch-Up Kits"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/accessories-siding-products/hardie-colorplus-touch-up-kits",
                        "type": "url"
                      }
                    }
                  }
                }
              ]
            },
            "variant": "highlights",
            "parameters": {
              "body": {
                "type": "text",
                "value": "See how Hardie® products can help your home look beautiful for years to come!"
              },
              "headline": {
                "type": "text",
                "value": "Explore more products"
              }
            }
          },
          {
            "type": "container",
            "slots": {
              "container-inner": [
                {
                  "type": "conversion",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/1MRmRjpjKa60BuCi9AKSi9/154190ebde2eae7d0edb8818006b3861/house-with-couple-hardie-plank-deep-ocean.jpg"
                          },
                          "width": {
                            "type": "number",
                            "value": 2126
                          },
                          "height": {
                            "type": "number",
                            "value": 800
                          },
                          "altText": {
                            "type": "text",
                            "value": "house with couple in hardie plank in deep ocean"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "text": {
                      "type": "text",
                      "value": "Ready to take the next step? Find a local pro to help you execute your design vision with Hardie® siding."
                    },
                    "title": {
                      "type": "text",
                      "value": "Start your renovation"
                    },
                    "cta1Link": {
                      "type": "link",
                      "value": {
                        "path": "/request-siding-quote",
                        "type": "projectMapNode",
                        "nodeId": "f89173e2-fea4-4a83-a5bd-49b5f7bf3e0e",
                        "projectMapId": "c350da3c-fcaf-49a5-9b94-1a73ef3408f9"
                      }
                    },
                    "cta1Text": {
                      "type": "text",
                      "value": "Find a local contractor"
                    },
                    "hasImage": {
                      "type": "checkbox",
                      "value": true
                    }
                  }
                }
              ]
            },
            "parameters": {
              "title": {
                "type": "text",
                "value": "Conversion Container"
              },
              "paddingTop": {
                "type": "select",
                "value": "Small"
              },
              "paddingBottom": {
                "type": "select",
                "value": "Small"
              },
              "backgroundType": {
                "type": "select",
                "value": "Transparent"
              }
            }
          },
          {
            "type": "disclaimerText",
            "parameters": {
              "text": {
                "type": "text",
                "value": "Based on Freedonia 2022 Global Siding (Cladding) demand estimates and James Hardie sales in North America."
              },
              "theme": {
                "type": "select",
                "value": "dark"
              }
            }
          },
          {
            "type": "disclaimerText",
            "parameters": {
              "text": {
                "type": "text",
                "value": "*Hardie® siding complies with ASTM E136 as a noncombustible cladding and is recognized by firefighters and fire departments across the U.S. including Chicago IL, St. Paul MN, Flagstaff, AZ and Wayne County, OH. Fiber cement fire resistance does not extend to applied paints or coatings, which may be damaged or char when exposed to flames."
              },
              "theme": {
                "type": "select",
                "value": "dark"
              }
            }
          }
        ]
      }
    }
  }

• Import the component into the file where <UniformComposition /> is defined, for example

  import "../components/Pdp.tsx"

Need more help? Check out the documentation.