{
  "$schema": "https://schemas.wp.org/trunk/block.json",
  "apiVersion": 3,
  "name": "bpsc/tabbed-feature-showcase-section",
  "version": "1.0.0",
  "title": "Tabbed Feature Showcase Section",
  "category": "bPlugins",
  "description": "Five interactive tabbed layouts for showcasing product features with large screenshots or mockups.",
  "keywords": [
    "tabs",
    "feature",
    "showcase",
    "screenshot",
    "SaaS",
    "product",
    "tabbed",
    "interactive",
    "section"
  ],
  "textdomain": "section-collection",
  "attributes": {
    "themeStyle": {
      "type": "object",
      "default": {
        "theme": "style-1"
      }
    },
    "content": {
      "type": "object",
      "default": {
        "badgeText": "Features",
        "title": "Everything you need, in one place",
        "subtitle": "Switch between features to see how it all fits together.",
        "headerAlign": "center"
      }
    },
    "elements": {
      "type": "object",
      "default": {
        "isBadge": true,
        "isTitle": true,
        "isSubtitle": true,
        "isBottomCta": false,
        "isDeviceFrame": false,
        "showBullets": true,
        "showPanelLink": false
      }
    },
    "tabs": {
      "type": "array",
      "default": [
        {
          "id": "tab-1",
          "tabLabel": "Dashboard",
          "tabIcon": "dashboard",
          "badge": "",
          "panelTitle": "Get a bird's-eye view of everything",
          "panelSubtitle": "Real-time metrics at a glance",
          "panelDescription": "Your entire workspace at a glance. Customise widgets, pin key metrics, and act without leaving the overview.",
          "panelBullets": [
            {
              "id": "b1",
              "icon": "check",
              "text": "Real-time KPIs"
            },
            {
              "id": "b2",
              "icon": "check",
              "text": "Drag-and-drop widgets"
            },
            {
              "id": "b3",
              "icon": "check",
              "text": "Role-based views"
            }
          ],
          "panelImage": "",
          "panelImageAlt": "Dashboard screenshot",
          "panelCtaLabel": "Learn more",
          "panelCtaUrl": "",
          "panelCtaNewTab": false
        },
        {
          "id": "tab-2",
          "tabLabel": "Analytics",
          "tabIcon": "analytics",
          "badge": "New",
          "panelTitle": "Data that actually helps you decide",
          "panelSubtitle": "Insights without the complexity",
          "panelDescription": "Deep-dive into trends, cohorts, and funnels without a data science degree.",
          "panelBullets": [
            {
              "id": "b4",
              "icon": "check",
              "text": "Funnel analysis"
            },
            {
              "id": "b5",
              "icon": "check",
              "text": "Cohort reports"
            },
            {
              "id": "b6",
              "icon": "check",
              "text": "One-click exports"
            }
          ],
          "panelImage": "",
          "panelImageAlt": "Analytics screenshot",
          "panelCtaLabel": "Learn more",
          "panelCtaUrl": "",
          "panelCtaNewTab": false
        },
        {
          "id": "tab-3",
          "tabLabel": "Automation",
          "tabIcon": "automation",
          "badge": "",
          "panelTitle": "Let the product do the work",
          "panelSubtitle": "No-code workflow builder",
          "panelDescription": "Build no-code workflows that trigger on any event — no engineering ticket required.",
          "panelBullets": [
            {
              "id": "b7",
              "icon": "check",
              "text": "Visual workflow builder"
            },
            {
              "id": "b8",
              "icon": "check",
              "text": "300+ native integrations"
            },
            {
              "id": "b9",
              "icon": "check",
              "text": "Error logs & retry"
            }
          ],
          "panelImage": "",
          "panelImageAlt": "Automation screenshot",
          "panelCtaLabel": "Learn more",
          "panelCtaUrl": "",
          "panelCtaNewTab": false
        }
      ]
    },
    "defaultActiveTab": {
      "type": "number",
      "default": 0
    },
    "panelLayout": {
      "type": "string",
      "default": "image-right"
    },
    "panelTransition": {
      "type": "string",
      "default": "crossfade"
    },
    "panelImageFrame": {
      "type": "string",
      "default": "none"
    },
    "bulletIconStyle": {
      "type": "string",
      "default": "check-circle"
    },
    "bottomCta": {
      "type": "object",
      "default": {
        "btnOneLabel": "Get started free",
        "btnOneUrl": "#",
        "btnOneNewTab": false,
        "btnTwoLabel": "See all features",
        "btnTwoUrl": "#",
        "btnTwoNewTab": false
      }
    },
    "accentColor": {
      "type": "object",
      "default": {
        "color": "#6366f1"
      }
    },
    "tabStyle": {
      "type": "object",
      "default": {
        "activeBg": "#6366f1",
        "activeColor": "#ffffff",
        "inactiveBg": "#f1f5f9",
        "inactiveColor": "#475569",
        "hoverBg": "#e0e7ff",
        "hoverColor": "#4338ca",
        "borderRadius": {
          "top": "8px",
          "right": "8px",
          "bottom": "8px",
          "left": "8px"
        },
        "gap": "8px",
        "iconSize": "22px",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 15,
            "tablet": 14,
            "mobile": 14
          },
          "lineHeight": "1.4",
          "letterSpace": "0px"
        }
      }
    },
    "panelTitleStyle": {
      "type": "object",
      "default": {
        "color": "#0f172a",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 700,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 28,
            "tablet": 24,
            "mobile": 20
          },
          "lineHeight": "1.3",
          "letterSpace": "0px"
        }
      }
    },
    "panelSubtitleStyle": {
      "type": "object",
      "default": {
        "color": "#6366f1",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 14,
            "tablet": 13,
            "mobile": 13
          },
          "lineHeight": "1.4",
          "letterSpace": "0.04em"
        }
      }
    },
    "panelBodyStyle": {
      "type": "object",
      "default": {
        "color": "#475569",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 400,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 16,
            "tablet": 15,
            "mobile": 15
          },
          "lineHeight": "1.7",
          "letterSpace": "0px"
        }
      }
    },
    "bulletStyle": {
      "type": "object",
      "default": {
        "color": "#6366f1",
        "textColor": "#334155",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 500,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 15,
            "tablet": 14,
            "mobile": 14
          },
          "lineHeight": "1.5",
          "letterSpace": "0px"
        }
      }
    },
    "panelImageStyle": {
      "type": "object",
      "default": {
        "borderRadius": {
          "top": "12px",
          "right": "12px",
          "bottom": "12px",
          "left": "12px"
        },
        "shadow": "0 20px 60px rgba(0,0,0,0.12)",
        "maxWidth": "100%"
      }
    },
    "panelLinkStyle": {
      "type": "object",
      "default": {
        "color": "#6366f1",
        "hoverColor": "#4338ca",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 15,
            "tablet": 14,
            "mobile": 14
          },
          "lineHeight": "1.4",
          "letterSpace": "0px"
        }
      }
    },
    "sectionHeaderStyle": {
      "type": "object",
      "default": {
        "titleColor": "#0f172a",
        "subtitleColor": "#64748b",
        "badgeBg": "#ede9fe",
        "badgeColor": "#7c3aed",
        "titleTypo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 800,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 42,
            "tablet": 34,
            "mobile": 26
          },
          "lineHeight": "1.15",
          "letterSpace": "-0.02em"
        },
        "subtitleTypo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 400,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 18,
            "tablet": 17,
            "mobile": 16
          },
          "lineHeight": "1.6",
          "letterSpace": "0px"
        }
      }
    },
    "ctaStyle": {
      "type": "object",
      "default": {
        "btnOneBg": "#6366f1",
        "btnOneColor": "#ffffff",
        "btnOneHoverBg": "#4f46e5",
        "btnOneHoverColor": "#ffffff",
        "btnTwoBg": "transparent",
        "btnTwoColor": "#475569",
        "btnTwoHoverBg": "#f1f5f9",
        "btnTwoHoverColor": "#0f172a",
        "btnTwoBorder": "#cbd5e1",
        "borderRadius": {
          "top": "10px",
          "right": "10px",
          "bottom": "10px",
          "left": "10px"
        },
        "padding": {
          "desktop": {
            "top": "13px",
            "right": "28px",
            "bottom": "13px",
            "left": "28px"
          },
          "tablet": {
            "top": "11px",
            "right": "22px",
            "bottom": "11px",
            "left": "22px"
          },
          "mobile": {
            "top": "10px",
            "right": "18px",
            "bottom": "10px",
            "left": "18px"
          }
        },
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 15,
            "tablet": 14,
            "mobile": 14
          },
          "lineHeight": "1.4",
          "letterSpace": "0px"
        }
      }
    },
    "wrapper": {
      "type": "object",
      "default": {
        "bg": {
          "type": "solid",
          "color": "#ffffff",
          "gradient": "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
          "image": {
            "url": ""
          },
          "position": "center center",
          "size": "cover",
          "repeat": "no-repeat",
          "overlayColor": "rgba(0,0,0,0)"
        },
        "padding": {
          "desktop": {
            "top": "80px",
            "right": "24px",
            "bottom": "80px",
            "left": "24px"
          },
          "tablet": {
            "top": "60px",
            "right": "20px",
            "bottom": "60px",
            "left": "20px"
          },
          "mobile": {
            "top": "48px",
            "right": "16px",
            "bottom": "48px",
            "left": "16px"
          }
        }
      }
    },
    "layout": {
      "type": "object",
      "default": {
        "maxWidth": "1200px",
        "tabGap": "8px",
        "contentGap": {
          "desktop": "56px",
          "tablet": "40px",
          "mobile": "32px"
        }
      }
    },
    "align": {
      "type": "string",
      "default": "full"
    }
  },
  "supports": {
    "align": [
      "wide",
      "full"
    ],
    "html": false
  },
  "example": {
    "attributes": {}
  },
  "editorScript": "file:../index.js",
  "style": "file:./view.css",
  "render": "file:./render.php",
  "viewScript": "file:./view.js"
}