{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"marketing-stats-horizontal-with-dividers","type":"registry:block","title":"Horizontal With Dividers","files":[{"path":"components/blocks/marketing/stats/horizontal-with-dividers.tsx","content":"import { ArrowUpRight, ArrowDownRight } from \"lucide-react\";\n\nexport default function HorizontalWithDividers() {\n  return (\n    <div className=\"container mx-auto px-4 md:px-6 2xl:max-w-[1400px] py-24 lg:py-32\">\n      <div className=\"mx-auto max-w-6xl\">\n        <div className=\"text-center mb-12\">\n          <h2 className=\"text-3xl font-bold md:text-4xl\">\n            Performance Metrics\n          </h2>\n          <p className=\"mt-3 text-muted-foreground\">\n            Measuring our success over the past year\n          </p>\n        </div>\n\n        <div className=\"flex flex-col lg:flex-row divide-y lg:divide-y-0 lg:divide-x divide-border\">\n          {/* Stat 1 */}\n          <div className=\"flex-1 p-6 md:p-8\">\n            <div className=\"text-center\">\n              <p className=\"text-lg font-medium text-muted-foreground\">\n                New Customers\n              </p>\n              <div className=\"mt-2 flex items-center justify-center\">\n                <span className=\"text-5xl font-bold\">14,532</span>\n                <span className=\"ml-2 inline-flex items-center text-sm font-medium text-emerald-500\">\n                  <ArrowUpRight className=\"mr-1 h-4 w-4\" />\n                  23%\n                </span>\n              </div>\n              <p className=\"mt-1 text-sm text-muted-foreground\">\n                vs previous quarter\n              </p>\n            </div>\n          </div>\n\n          {/* Stat 2 */}\n          <div className=\"flex-1 p-6 md:p-8\">\n            <div className=\"text-center\">\n              <p className=\"text-lg font-medium text-muted-foreground\">\n                Avg. Order Value\n              </p>\n              <div className=\"mt-2 flex items-center justify-center\">\n                <span className=\"text-5xl font-bold\">$89.43</span>\n                <span className=\"ml-2 inline-flex items-center text-sm font-medium text-emerald-500\">\n                  <ArrowUpRight className=\"mr-1 h-4 w-4\" />\n                  12%\n                </span>\n              </div>\n              <p className=\"mt-1 text-sm text-muted-foreground\">\n                vs previous quarter\n              </p>\n            </div>\n          </div>\n\n          {/* Stat 3 */}\n          <div className=\"flex-1 p-6 md:p-8\">\n            <div className=\"text-center\">\n              <p className=\"text-lg font-medium text-muted-foreground\">\n                Customer Returns\n              </p>\n              <div className=\"mt-2 flex items-center justify-center\">\n                <span className=\"text-5xl font-bold\">3.2%</span>\n                <span className=\"ml-2 inline-flex items-center text-sm font-medium text-emerald-500\">\n                  <ArrowDownRight className=\"mr-1 h-4 w-4\" />\n                  8%\n                </span>\n              </div>\n              <p className=\"mt-1 text-sm text-muted-foreground\">\n                vs previous quarter\n              </p>\n            </div>\n          </div>\n\n          {/* Stat 4 */}\n          <div className=\"flex-1 p-6 md:p-8\">\n            <div className=\"text-center\">\n              <p className=\"text-lg font-medium text-muted-foreground\">\n                Retention Rate\n              </p>\n              <div className=\"mt-2 flex items-center justify-center\">\n                <span className=\"text-5xl font-bold\">76%</span>\n                <span className=\"ml-2 inline-flex items-center text-sm font-medium text-emerald-500\">\n                  <ArrowUpRight className=\"mr-1 h-4 w-4\" />\n                  5%\n                </span>\n              </div>\n              <p className=\"mt-1 text-sm text-muted-foreground\">\n                vs previous quarter\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n","type":"registry:component","target":"components/blocks/marketing/stats/horizontal-with-dividers.tsx"}],"description":"A single row of figures split by thin vertical dividers for a tidy summary. Use it under a hero to surface three or four headline numbers fast.","dependencies":["lucide-react"]}