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-soffit-panels",
    "component": {
      "type": "pdp",
      "_pattern": "46b771f9-cb9d-47a1-a8d8-65f160d6948e",
      "parameters": {
        "slug": {
          "type": "text",
          "value": "hardie-soffit-panels"
        }
      },
      "slots": {
        "content": [
          {
            "type": "headlineLocation",
            "parameters": {
              "theme": {
                "type": "select",
                "value": "secondary"
              },
              "title": {
                "type": "text",
                "value": "Hardie® Soffit Panels"
              },
              "isHeader": {
                "type": "checkbox",
                "value": true
              },
              "subtitle": {
                "type": "text",
                "value": "Hardie® Soffit panels help protect the vulnerable gap under the eaves of your home from fire and moisture damage. Vented soffits are a key tool for controlling attic air flow, helping keep your home cool in summer and prevent moisture accumulation in winter."
              },
              "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": "Fire resistant",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          },
                          {
                            "nodeType": "paragraph",
                            "data": {},
                            "content": [
                              {
                                "nodeType": "text",
                                "value": "Hardie® Soffit panels are noncombustible—they will not burn.* Enclosing eaves with noncombustible fiber cement soffit is recommended** to improve your home's resilience to wildfires. ",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          }
                        ]
                      }
                    },
                    "icon": {
                      "type": "select",
                      "value": "durable"
                    },
                    "name": {
                      "type": "text",
                      "value": "Fire resistant"
                    }
                  }
                },
                {
                  "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 substrate warranty on our soffit products. ColorPlus® Technology finishes offer superior UV resistance.  ",
                                "marks": [],
                                "data": {}
                              }
                            ]
                          }
                        ]
                      }
                    },
                    "icon": {
                      "type": "select",
                      "value": "house-heart"
                    },
                    "name": {
                      "type": "text",
                      "value": "Lasting value - alternate 1"
                    }
                  }
                }
              ],
              "sectionHeader": [
                {
                  "type": "sectionHeader",
                  "variant": "thin",
                  "parameters": {
                    "body": {
                      "type": "text",
                      "value": "Add beauty that's built to last to your home."
                    },
                    "theme": {
                      "type": "select",
                      "value": "transparent"
                    },
                    "title": {
                      "type": "text",
                      "value": "Why Choose Hardie® Soffit panels?"
                    }
                  }
                }
              ]
            },
            "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® Soffit. "
              }
            }
          },
          {
            "type": "carousel",
            "slots": {
              "containerInner": [
                {
                  "type": "editorialCard",
                  "slots": {
                    "image": [
                      {
                        "type": "image",
                        "parameters": {
                          "src": {
                            "type": "image",
                            "value": "//images.ctfassets.net/dzi2asncd44t/6NXuKLWjKIUy3hcw8je6k0/20fc9da840368b1ba54b559f0f82c19a/product-detail-magnolia-hardie-plank-wandering-green.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Plank"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/exterior-siding-products/hardie-plank-lap-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/1CMTtpxYi1Nw2fjR9d1uZ0/1faa2746cec9f4eab8c7986932b11d7f/window-hardie-plank-gray-shadow-hardie-trim-arctic-white.jpg"
                          }
                        }
                      }
                    ]
                  },
                  "parameters": {
                    "title": {
                      "type": "text",
                      "value": "Hardie® Trim"
                    },
                    "ctaLink": {
                      "type": "link",
                      "value": {
                        "path": "/product-catalog/trim-products/hardie-trim-boards",
                        "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/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": "Hardie® siding complies with ASTM E136 as a noncombustible cladding and is recognized by fire departments across the U.S. including Marietta, GA, Flagstaff, AZ and Orange County, CA. 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"
              }
            }
          },
          {
            "type": "disclaimerText",
            "parameters": {
              "text": {
                "type": "text",
                "value": "*The US Department of Housing and Urban Development (HUD) and the Insurance Institute of Business and Home Safety (IBHS) both recommend enclosing eaves "
              },
              "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.