{"success":true,"data":{"block":{"id":"contact-warranty","name":"Contact Warranty Claim","title":"Contact Warranty Claim","category":"Contact","categorySlug":"contact","description":"Warranty claim form with product information, purchase details, and issue description. Essential for product support teams.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290597/gtxtxytai44nnacz35n0efr1v9a3/contact-warranty-desktop.png","mobile":"https://cdn.ing/assets/i/r/290598/qh1v295r6rac1wr9gvlh0yo4muz2/contact-warranty-mobile.png"},"componentPath":"blocks/contact/contact-warranty.tsx","code":"\"use client\";\n\nimport { ContactWarranty } from \"@opensite/ui/blocks/contact/contact-warranty\";\nimport { demoFormEngineApi } from \"@/lib/form-demo-data\";\nimport type { FormFieldConfig } from \"@opensite/ui\";\n\nconst formFields: FormFieldConfig[] = [\n  {\n    name: \"first_name\",\n    type: \"text\",\n    label: \"First Name\",\n    placeholder: \"First name\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"last_name\",\n    type: \"text\",\n    label: \"Last Name\",\n    placeholder: \"Last name\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"email\",\n    type: \"email\",\n    label: \"Email Address\",\n    placeholder: \"your@email.com\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"phone\",\n    type: \"tel\",\n    label: \"Phone Number\",\n    placeholder: \"+1 (555) 000-0000\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"order_number\",\n    type: \"text\",\n    label: \"Order Number\",\n    placeholder: \"e.g., ORD-123456\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"purchase_date\",\n    type: \"date-picker\",\n    label: \"Purchase Date\",\n    placeholder: \"Select date\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"product_name\",\n    type: \"text\",\n    label: \"Product Name\",\n    placeholder: \"Name or model of the product\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"serial_number\",\n    type: \"text\",\n    label: \"Serial Number (if applicable)\",\n    placeholder: \"Product serial number\",\n    required: false,\n    columnSpan: 6,\n  },\n  {\n    name: \"claim_type\",\n    type: \"radio\",\n    label: \"Type of Claim\",\n    required: true,\n    columnSpan: 12,\n    layout: \"grid\",\n    options: [\n      {\n        value: \"defect\",\n        label: \"Manufacturing Defect\",\n        description: \"Product has a manufacturing defect.\",\n      },\n      {\n        value: \"malfunction\",\n        label: \"Product Malfunction\",\n        description: \"Product stopped working or not working properly.\",\n      },\n      {\n        value: \"damage\",\n        label: \"Damage in Transit\",\n        description: \"Product arrived damaged.\",\n      },\n      {\n        value: \"missing\",\n        label: \"Missing Parts\",\n        description: \"Product is missing components or parts.\",\n      },\n    ],\n  },\n  {\n    name: \"issue_description\",\n    type: \"textarea\",\n    label: \"Describe the Issue\",\n    placeholder: \"Please provide detailed information about the problem, including when it started, what you've tried, and any error messages...\",\n    required: true,\n    rows: 5,\n    columnSpan: 12,\n  },\n  {\n    name: \"preferred_resolution\",\n    type: \"select\",\n    label: \"Preferred Resolution\",\n    required: true,\n    columnSpan: 12,\n    options: [\n      { value: \"repair\", label: \"Repair the product\" },\n      { value: \"replacement\", label: \"Replace with new product\" },\n      { value: \"refund\", label: \"Full refund\" },\n      { value: \"discuss\", label: \"Discuss options with support\" },\n    ],\n  },\n  {\n    name: \"receipt\",\n    type: \"file\",\n    label: \"Upload Proof of Purchase\",\n    placeholder: \"Upload receipt or order confirmation...\",\n    required: true,\n    accept: \"image/*,.pdf\",\n    maxSize: 10 * 1024 * 1024,\n    maxFiles: 1,\n    columnSpan: 12,\n  },\n  {\n    name: \"photos\",\n    type: \"file\",\n    label: \"Upload Photos of the Issue\",\n    placeholder: \"Upload photos showing the defect or damage...\",\n    required: true,\n    accept: \"image/*\",\n    maxSize: 10 * 1024 * 1024,\n    maxFiles: 5,\n    multiple: true,\n    columnSpan: 12,\n  },\n  {\n    name: \"additional_notes\",\n    type: \"textarea\",\n    label: \"Additional Notes (Optional)\",\n    placeholder: \"Any other information that might be helpful...\",\n    required: false,\n    rows: 3,\n    columnSpan: 12,\n  },\n];\n\nexport default function Demo() {\n  return (\n    <ContactWarranty\n      heading=\"Warranty Claim\"\n      description=\"We stand behind the quality of our products. If you're experiencing an issue covered under warranty, submit your claim below and our support team will process it promptly.\"\n      formEngineSetup={{\n        api: demoFormEngineApi,\n        fields: formFields,\n        successMessage: \"Your warranty claim has been submitted successfully! You'll receive a confirmation email with your claim number. Our team will review your claim and respond within 2-3 business days.\",\n        formLayoutSettings: {\n          submitButtonSetup: {\n            submitLabel: \"Submit Warranty Claim\",\n          },\n        },\n      }}\n      background=\"white\"\n      pattern=\"dashedGridFadeTop\"\n      patternOpacity={0.9}\n    />\n  );\n}","propsSchema":{"heading":{"type":"object","description":"Main heading text","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Description text below heading","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the section","required":false},"containerClassName":{"type":"string","description":"Additional CSS classes for the container","required":false},"headerClassName":{"type":"string","description":"Additional CSS classes for the header","required":false},"headingClassName":{"type":"string","description":"Additional CSS classes for the heading","required":false},"descriptionClassName":{"type":"string","description":"Additional CSS classes for the description","required":false},"cardClassName":{"type":"string","description":"Additional CSS classes for the card","required":false},"cardContentClassName":{"type":"string","description":"Additional CSS classes for the card content","required":false},"background":{"type":"string","description":"Background style for the section","typeLabel":"SectionBackground","required":false},"spacing":{"type":"object","description":"Vertical spacing for the section","fields":{},"typeLabel":"SectionSpacing","required":false},"pattern":{"type":"object","description":"Optional background pattern name or URL","fields":{},"typeLabel":"PatternName","required":false},"patternOpacity":{"type":"number","description":"Pattern overlay opacity (0-1)","required":false},"formEngineSetup":{"type":"object","description":"Full form engine setup and props","typeLabel":"FormEngineProps","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"defaultProps":{},"dependencies":["@opensite/ui","@page-speed/forms"],"tags":["contact","warranty","claim","form","support","product"],"performance":{},"importantUsageNotes":"Ensure to follow the form implementation requirements properly (correct field types, labels, validation, and submit handling). The form fields shown in the demo are calibrated for a warranty claim use case — first/last name, email, phone, order number, purchase date picker, product name, serial number (optional), claim type radio (defect/malfunction/damage), issue description, and optional photo upload — do not change the field set unless the site has clearly different requirements. Ensure to only supply a valid set of contact data points (email, phone, address, etc), DO NOT make up any contact data. Follow the example props closely for this block."}},"timestamp":"2026-05-13T10:42:27.405Z"}