{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "pagination",
  "type": "registry:ui",
  "title": "Pagination (MIAN)",
  "description": "Move between pages of results.",
  "categories": [
    "navigation",
    "pagination",
    "pager",
    "pages",
    "next"
  ],
  "registryDependencies": [
    "https://mian.ro/r/mian-base.json"
  ],
  "files": [
    {
      "path": "mian/components/pagination.css",
      "type": "registry:file",
      "target": "mian/components/pagination.css",
      "content": ".mn-pagination ul { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin: 0; padding: 0; list-style: none; }\n.mn-page {\n  display: inline-flex; align-items: center; justify-content: center; gap: .3rem;\n  min-width: var(--mn-size-md); height: var(--mn-size-md); padding: 0 .6rem;\n  border: var(--mn-border-w) solid transparent; border-radius: var(--mn-radius-field);\n  background: none; color: var(--mn-fg); font: 500 var(--mn-text-sm)/1 var(--mn-font);\n  text-decoration: none; cursor: pointer; font-variant-numeric: tabular-nums;\n}\n.mn-page:hover { background: var(--mn-hover); }\n.mn-page[aria-current=\"page\"] { border-color: var(--mn-input); background: var(--mn-surface); box-shadow: var(--mn-shadow-sm); }\n.mn-page:focus-visible { outline: none; box-shadow: var(--mn-focus); }\n.mn-page[aria-disabled=\"true\"] { opacity: .45; pointer-events: none; }\n.mn-page svg { width: 1rem; height: 1rem; }\n.mn-page-ellipsis { display: inline-grid; place-items: center; min-width: var(--mn-size-md); color: var(--mn-muted); }"
    },
    {
      "path": "mian/examples/pagination.html",
      "type": "registry:file",
      "target": "mian/examples/pagination.html",
      "content": "<!-- Basic -->\n<nav class=\"mn-pagination\" aria-label=\"Pagination\"><ul>\n  <li><a class=\"mn-page\" href=\"#pagination\" aria-disabled=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m15 6-6 6 6 6\"/></svg><span>Previous</span></a></li>\n  <li><a class=\"mn-page\" href=\"#pagination\" aria-current=\"page\">1</a></li>\n  <li><a class=\"mn-page\" href=\"#pagination\">2</a></li>\n  <li><a class=\"mn-page\" href=\"#pagination\">3</a></li>\n  <li><span class=\"mn-page-ellipsis\" aria-hidden=\"true\">…</span></li>\n  <li><a class=\"mn-page\" href=\"#pagination\">12</a></li>\n  <li><a class=\"mn-page\" href=\"#pagination\"><span>Next</span><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 6 6 6-6 6\"/></svg></a></li>\n</ul></nav>"
    }
  ],
  "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/pagination",
  "meta": {
    "mian": {
      "license": "LicenseRef-MIAN-1.0",
      "requiresJs": false,
      "classes": [
        "mn-pagination",
        "mn-page",
        "mn-page-ellipsis"
      ],
      "accessibility": [
        "<nav aria-label=\"Pagination\">. Give arrows text labels. Disabled links use aria-disabled=\"true\"."
      ],
      "intents": [
        "pagination",
        "next previous",
        "page numbers",
        "results pages"
      ]
    }
  }
}