{ "$schema": "https://schemas.wp.org/trunk/block.json", "apiVersion": 3, "name": "bpsc/roi-calculator-section", "version": "1.0.0", "title": "ROI / Savings Calculator Section", "category": "bPlugins", "description": "An interactive ROI and savings calculator with configurable inputs, safe formulas, and live results.", "keywords": [ "calculator", "roi", "savings", "interactive", "section", "estimate", "cost", "tool" ], "textdomain": "section-collection", "attributes": { "themeStyle": { "type": "object", "default": { "theme": "style-1" } }, "content": { "type": "object", "default": { "badgeText": "Calculate Your ROI", "title": "See How Much You Could Save", "subtitle": "Adjust the inputs below to see a personalised estimate based on your business.", "headerAlign": "center", "ctaHeading": "Ready to see these results?", "btnOneLabel": "Start Free Trial", "btnOneUrl": "", "btnOneNewTab": false, "btnTwoLabel": "Book a Demo", "btnTwoUrl": "", "btnTwoNewTab": false, "disclaimerText": "Estimates are illustrative. Actual results may vary.", "trustText": "Join 4,200+ teams saving an average of $38k/year", "resultsHeading": "Your Estimated Results" } }, "inputs": { "type": "array", "default": [ { "id": "team_size", "label": "Team Size", "helperText": "Number of people on your team", "inputType": "range", "min": 1, "max": 500, "step": 1, "defaultValue": 25, "unit": "people", "unitPosition": "suffix", "wizardStep": 1, "options": [] }, { "id": "hourly_rate", "label": "Average Hourly Rate", "helperText": "Average fully-loaded cost per employee per hour", "inputType": "number", "min": 10, "max": 500, "step": 5, "defaultValue": 50, "unit": "$", "unitPosition": "prefix", "wizardStep": 1, "options": [] }, { "id": "hours_saved", "label": "Hours Saved Per Week", "helperText": "Estimated hours saved per person per week", "inputType": "range", "min": 0.5, "max": 20, "step": 0.5, "defaultValue": 4, "unit": "hrs/wk", "unitPosition": "suffix", "wizardStep": 2, "options": [] } ] }, "outputs": { "type": "array", "default": [ { "id": "annual_savings", "label": "Annual Savings", "formula": "team_size * hourly_rate * hours_saved * 52", "format": "currency", "decimals": 0, "currencySymbol": "$", "currencyPosition": "prefix", "emphasis": "hero", "description": "vs. doing it manually" }, { "id": "weekly_hours", "label": "Hours Recovered Per Week", "formula": "team_size * hours_saved", "format": "number", "decimals": 0, "currencySymbol": "$", "currencyPosition": "prefix", "emphasis": "normal", "description": "" }, { "id": "monthly_savings", "label": "Monthly Savings", "formula": "team_size * hourly_rate * hours_saved * 52 / 12", "format": "currency", "decimals": 0, "currencySymbol": "$", "currencyPosition": "prefix", "emphasis": "normal", "description": "" } ] }, "elements": { "type": "object", "default": { "isBadge": true, "isTitle": true, "isSubtitle": true, "isDisclaimer": true, "isBtnOne": true, "isBtnTwo": true, "isResultsHeading": true, "isTrustText": false, "isHelperText": true, "isUnitLabel": true } }, "layout": { "type": "object", "default": { "maxWidth": "1100px", "contentAlign": "center", "resultsSticky": false, "wizardStepCount": 2 } }, "accentColor": { "type": "object", "default": { "color": "#6366f1" } }, "sectionHeaderStyle": { "type": "object", "default": { "titleColor": "#0f172a", "subtitleColor": "#475569", "badgeBg": "#eef2ff", "badgeColor": "#4f46e5", "titleTypo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 700, "isUploadFont": true, "fontSize": { "desktop": 42, "tablet": 34, "mobile": 28 }, "lineHeight": "1.2", "letterSpace": "-0.01em" }, "subtitleTypo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 400, "isUploadFont": true, "fontSize": { "desktop": 18, "tablet": 16, "mobile": 15 }, "lineHeight": "1.65", "letterSpace": "0px" } } }, "inputLabelStyle": { "type": "object", "default": { "color": "#1e293b", "typo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 600, "isUploadFont": true, "fontSize": { "desktop": 15, "tablet": 14, "mobile": 14 }, "lineHeight": "1.4", "letterSpace": "0px" } } }, "primaryOutputStyle": { "type": "object", "default": { "color": "#6366f1", "typo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 800, "isUploadFont": true, "fontSize": { "desktop": 56, "tablet": 44, "mobile": 36 }, "lineHeight": "1.1", "letterSpace": "-0.02em" } } }, "secondaryOutputStyle": { "type": "object", "default": { "color": "#0f172a", "typo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 700, "isUploadFont": true, "fontSize": { "desktop": 32, "tablet": 26, "mobile": 22 }, "lineHeight": "1.2", "letterSpace": "-0.01em" } } }, "outputLabelStyle": { "type": "object", "default": { "color": "#64748b", "typo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 500, "isUploadFont": true, "fontSize": { "desktop": 14, "tablet": 13, "mobile": 13 }, "lineHeight": "1.4", "letterSpace": "0px" } } }, "inputPanelStyle": { "type": "object", "default": { "backgroundColor": "#ffffff", "borderColor": "#e2e8f0", "borderWidth": "1px", "borderRadius": { "top": "16px", "right": "16px", "bottom": "16px", "left": "16px" }, "shadow": "0 4px 24px rgba(0,0,0,0.07)", "padding": { "desktop": { "top": "40px", "right": "40px", "bottom": "40px", "left": "40px" }, "tablet": { "top": "28px", "right": "28px", "bottom": "28px", "left": "28px" }, "mobile": { "top": "20px", "right": "20px", "bottom": "20px", "left": "20px" } } } }, "outputPanelStyle": { "type": "object", "default": { "backgroundColor": "#f8fafc", "borderColor": "#e2e8f0", "borderWidth": "1px", "borderRadius": { "top": "16px", "right": "16px", "bottom": "16px", "left": "16px" }, "shadow": "0 4px 24px rgba(0,0,0,0.07)", "padding": { "desktop": { "top": "40px", "right": "40px", "bottom": "40px", "left": "40px" }, "tablet": { "top": "28px", "right": "28px", "bottom": "28px", "left": "28px" }, "mobile": { "top": "20px", "right": "20px", "bottom": "20px", "left": "20px" } } } }, "sliderStyle": { "type": "object", "default": { "trackColor": "#e2e8f0", "thumbColor": "#6366f1", "fillColor": "#6366f1", "trackHeight": "6px", "thumbSize": "20px" } }, "ctaStyle": { "type": "object", "default": { "btnOneBg": "#6366f1", "btnOneColor": "#ffffff", "btnOneHoverBg": "#4f46e5", "btnOneHoverColor": "#ffffff", "btnTwoBg": "transparent", "btnTwoColor": "#6366f1", "btnTwoHoverBg": "#eef2ff", "btnTwoHoverColor": "#4f46e5", "btnTwoBorder": "#6366f1", "borderRadius": { "top": "8px", "right": "8px", "bottom": "8px", "left": "8px" }, "padding": { "desktop": { "top": "14px", "right": "32px", "bottom": "14px", "left": "32px" }, "tablet": { "top": "12px", "right": "24px", "bottom": "12px", "left": "24px" }, "mobile": { "top": "12px", "right": "20px", "bottom": "12px", "left": "20px" } }, "typo": { "fontCategory": "sans-serif", "fontFamily": "Default", "fontWeight": 600, "isUploadFont": true, "fontSize": { "desktop": 15, "tablet": 15, "mobile": 14 }, "lineHeight": "1.4", "letterSpace": "0px" } } }, "wrapper": { "type": "object", "default": { "bg": { "type": "solid", "color": "#f1f5f9", "gradient": "linear-gradient(135deg,#f1f5f9 0%,#e0e7ff 100%)", "image": { "url": "" }, "position": "center center", "repeat": "no-repeat", "size": "cover", "overlayColor": "rgba(0,0,0,0)" }, "padding": { "desktop": { "top": "100px", "right": "24px", "bottom": "100px", "left": "24px" }, "tablet": { "top": "70px", "right": "20px", "bottom": "70px", "left": "20px" }, "mobile": { "top": "50px", "right": "16px", "bottom": "50px", "left": "16px" } } } }, "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" }