{
  "formName": "Sample Contact Form",
  "formDescription": "A simple contact form with basic fields",
  "formId": null,
  "components": [
    {
      "type": "heading",
      "props": {
        "name": "form_title",
        "value": "Contact Us",
        "level": 2,
        "width": "100%",
        "gridColumn": "span 12",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "paragraph",
      "props": {
        "name": "form_description",
        "value": "Please fill out the form below and we'll get back to you as soon as possible.",
        "width": "100%",
        "gridColumn": "span 12",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "text",
      "props": {
        "name": "full_name",
        "label": "Full Name",
        "placeholder": "Enter your full name",
        "help": "Please provide your first and last name",
        "validation": "required|min:2",
        "value": "",
        "width": "50%",
        "gridColumn": "span 6",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "email",
      "props": {
        "name": "email_address",
        "label": "Email Address",
        "placeholder": "your.email@example.com",
        "help": "We'll use this to respond to your inquiry",
        "validation": "required|email",
        "value": "",
        "width": "50%",
        "gridColumn": "span 6",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "select",
      "props": {
        "name": "inquiry_type",
        "label": "Type of Inquiry",
        "help": "Select the category that best describes your inquiry",
        "validation": "required",
        "value": "",
        "placeholder": "Choose an option",
        "options": [
          { "label": "General Question", "value": "general" },
          { "label": "Technical Support", "value": "support" },
          { "label": "Sales Inquiry", "value": "sales" },
          { "label": "Partnership", "value": "partnership" },
          { "label": "Other", "value": "other" }
        ],
        "width": "100%",
        "gridColumn": "span 12",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "textarea",
      "props": {
        "name": "message",
        "label": "Message",
        "placeholder": "Please describe your inquiry in detail...",
        "help": "Provide as much detail as possible to help us assist you better",
        "validation": "required|min:10",
        "value": "",
        "rows": 5,
        "width": "100%",
        "gridColumn": "span 12",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "checkbox",
      "props": {
        "name": "contact_preferences",
        "label": "Contact Preferences",
        "help": "How would you like us to contact you? (Select all that apply)",
        "validation": "",
        "value": [],
        "options": [
          { "label": "Email", "value": "email" },
          { "label": "Phone", "value": "phone" },
          { "label": "SMS", "value": "sms" }
        ],
        "width": "50%",
        "gridColumn": "span 6",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "switch",
      "props": {
        "name": "newsletter_signup",
        "label": "Subscribe to Newsletter",
        "help": "Receive updates about our products and services",
        "validation": "",
        "value": false,
        "width": "50%",
        "gridColumn": "span 6",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    },
    {
      "type": "button",
      "props": {
        "name": "submit_button",
        "label": "Send Message",
        "buttonType": "submit",
        "variant": "primary",
        "size": "md",
        "disabled": false,
        "width": "25%",
        "gridColumn": "span 3",
        "conditionalLogic": {
          "action": "show",
          "enabled": false,
          "operator": "and",
          "conditions": []
        }
      }
    }
  ],
  "customScript": "// Auto-format email to lowercase\nonFieldChange(['email_address'], () => {\n  const email = getField('email_address');\n  if (email) {\n    setField('email_address', email.toLowerCase());\n  }\n});\n\n// Show success message on form load\nshowInfo('Please fill out all required fields marked with an asterisk (*)');",
  "customCSS": ".form-container {\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n  color: white;\n  padding: 20px;\n  border-radius: 12px;\n}\n\n.form-field {\n  margin-bottom: 16px;\n}",
  "formEvents": {
    "onLoad": true,
    "onFieldChange": true,
    "onSubmit": false,
    "onValidation": false
  },
  "scriptMode": "safe"
} 