{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "divider",
  "type": "registry:ui",
  "title": "Divider (MIAN)",
  "description": "A horizontal or vertical rule, optionally with a label.",
  "categories": [
    "data display",
    "divider",
    "separator",
    "hr",
    "rule"
  ],
  "registryDependencies": [
    "https://mian.ro/r/mian-base.json"
  ],
  "files": [
    {
      "path": "mian/components/divider.css",
      "type": "registry:file",
      "target": "mian/components/divider.css",
      "content": ".mn-divider { display: flex; align-items: center; gap: .75rem; margin: 1rem 0; border: 0; color: var(--mn-muted); font-size: .75rem; font-weight: 500; }\n.mn-divider::before, .mn-divider::after { content: \"\"; flex: 1; height: var(--mn-border-w); background: var(--mn-border); }\n.mn-divider:empty { gap: 0; }\n.mn-divider:empty::after { display: none; }\n.mn-divider-vertical { flex-direction: column; margin: 0 .5rem; align-self: stretch; }\n.mn-divider-vertical::before, .mn-divider-vertical::after { width: var(--mn-border-w); height: auto; }"
    },
    {
      "path": "mian/examples/divider.html",
      "type": "registry:file",
      "target": "mian/examples/divider.html",
      "content": "<!-- Labelled and vertical -->\n<div style=\"max-width:24rem\">\n  <button class=\"mn-btn mn-btn-outline mn-btn-block\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M9 19c-4 1.5-4-2-6-2.5m12 5v-3.5c0-1 .1-1.4-.5-2 2.8-.3 5.5-1.4 5.5-6a4.6 4.6 0 0 0-1.3-3.2 4.2 4.2 0 0 0-.1-3.2s-1-.3-3.4 1.3a11.6 11.6 0 0 0-6 0C6.8 2.3 5.8 2.6 5.8 2.6a4.2 4.2 0 0 0-.1 3.2A4.6 4.6 0 0 0 4.4 9c0 4.6 2.7 5.7 5.5 6-.6.6-.6 1.2-.5 2V21\"/></svg> Continue with GitHub</button>\n  <div class=\"mn-divider\" role=\"separator\">or continue with</div>\n  <button class=\"mn-btn mn-btn-block\">Email</button>\n</div>\n<div class=\"mn-row\" style=\"height:1.5rem\">Blog<span class=\"mn-divider mn-divider-vertical\"></span>Docs<span class=\"mn-divider mn-divider-vertical\"></span>Source</div>"
    }
  ],
  "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/divider",
  "meta": {
    "mian": {
      "license": "LicenseRef-MIAN-1.0",
      "requiresJs": false,
      "classes": [
        "mn-divider",
        "mn-divider-vertical"
      ],
      "accessibility": [
        "An empty <hr> is announced as a separator. A labelled divider is presentational; use role=\"separator\" if it divides groups."
      ],
      "intents": [
        "separator",
        "horizontal rule",
        "or divider"
      ]
    }
  }
}
