{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "process",
  "type": "registry:ui",
  "title": "Process (MIAN)",
  "description": "Numbered steps in a row, how it works, how to order, what happens next.",
  "categories": [
    "sections",
    "process",
    "steps",
    "how it works",
    "workflow"
  ],
  "registryDependencies": [
    "https://mian.ro/r/mian-base.json"
  ],
  "files": [
    {
      "path": "mian/components/process.css",
      "type": "registry:file",
      "target": "mian/components/process.css",
      "content": ".mn-process { display: grid; gap: 2.25rem; margin: 0; padding: 0; list-style: none; counter-reset: mn-step; }\n@container mn (min-width: 48rem) { .mn-process { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 1.5rem; } }\n.mn-process > li { display: grid; gap: .5rem; align-content: start; padding-top: 1.1rem; border-top: 2px solid var(--mn-fg); counter-increment: mn-step; }\n.mn-process > li > * { margin: 0; }\n.mn-process > li::before { content: counter(mn-step, decimal-leading-zero); font: 500 .8125rem/1 var(--mn-font-mono); color: var(--mn-muted); margin-bottom: .5rem; }\n.mn-process h3 { font: var(--mn-heading-weight) 1.0625rem/1.3 var(--mn-font-heading); letter-spacing: -.01em; }\n.mn-process p { color: var(--mn-muted); font-size: .9375rem; line-height: 1.6; }"
    },
    {
      "path": "mian/examples/process.html",
      "type": "registry:file",
      "target": "mian/examples/process.html",
      "content": "<!-- How it works -->\n<section class=\"mn-section mn-section-sm\"><div class=\"mn-container\"><ol class=\"mn-process\">\n  <li><h3>Connect</h3><p>Banks, cards and payroll, read-only, in about ten minutes.</p></li>\n  <li><h3>Review</h3><p>Approve the first matches; Ledger writes rules from them.</p></li>\n  <li><h3>Close</h3><p>Lock the period and export the trail for your auditor.</p></li>\n</ol></div></section>"
    }
  ],
  "docs": "MIAN components are HTML + CSS classes, not React components. The styles are already included in mian-base; this item adds the component's CSS section and example markup for reference. Docs: https://mian.ro/components/process",
  "meta": {
    "mian": {
      "license": "LicenseRef-MIAN-1.0",
      "requiresJs": false,
      "classes": [
        "mn-process"
      ],
      "accessibility": [
        "An ordered list announces the number of steps; the visible numbers are decorative."
      ],
      "intents": [
        "how it works",
        "our process",
        "steps",
        "onboarding steps",
        "what happens next",
        "workflow"
      ]
    }
  }
}