{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "dock",
  "type": "registry:ui",
  "title": "Dock (MIAN)",
  "description": "A bottom navigation bar for mobile apps and compact layouts, floating or in the page.",
  "categories": [
    "navigation",
    "dock",
    "bottom navigation",
    "tab bar",
    "mobile nav"
  ],
  "registryDependencies": [
    "https://mian.ro/r/mian-base.json"
  ],
  "files": [
    {
      "path": "mian/components/dock.css",
      "type": "registry:file",
      "target": "mian/components/dock.css",
      "content": ".mn-dock {\n  display: flex; align-items: stretch; justify-content: space-around; gap: .25rem;\n  padding: .35rem; max-width: 100%;\n  border: var(--mn-border-w) solid var(--mn-border); border-radius: calc(var(--mn-radius-box) + 4px);\n  background: color-mix(in srgb, var(--mn-surface) 88%, transparent);\n  -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4);\n  box-shadow: var(--mn-shadow-md);\n}\n.mn-dock-fixed { position: fixed; z-index: 40; left: 50%; bottom: max(.75rem, env(safe-area-inset-bottom)); translate: -50% 0; width: min(28rem, calc(100vw - 1.5rem)); }\n.mn-dock-item {\n  display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: .2rem;\n  min-width: 3rem; min-height: 3rem; padding: .35rem .5rem;\n  border: 0; border-radius: var(--mn-radius-box); background: none;\n  color: var(--mn-muted); font: 500 .6875rem/1 var(--mn-font); text-decoration: none; cursor: pointer;\n  transition: color var(--mn-duration) var(--mn-ease), background-color var(--mn-duration) var(--mn-ease);\n}\n.mn-dock-item svg { width: 1.25rem; height: 1.25rem; }\n.mn-dock-item:hover { color: var(--mn-fg); background: var(--mn-hover); }\n.mn-dock-item[aria-current=\"page\"] { color: var(--mn-primary-text); }\n.mn-dock-item[aria-current=\"page\"] svg { transform: translateY(-1px); }\n.mn-dock-item:focus-visible { outline: none; box-shadow: var(--mn-focus); }\n.mn-dock-compact .mn-dock-item > span { display: none; }"
    },
    {
      "path": "mian/examples/dock.html",
      "type": "registry:file",
      "target": "mian/examples/dock.html",
      "content": "<!-- Dock -->\n<nav class=\"mn-dock\" aria-label=\"App\" style=\"max-width:26rem;margin:auto\">\n  <a class=\"mn-dock-item\" href=\"#\" aria-current=\"page\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M3 11 12 3l9 8\"/><path d=\"M5 10v10h14V10\"/></svg><span>Home</span></a>\n  <a class=\"mn-dock-item\" href=\"#\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"11\" cy=\"11\" r=\"7\"/><path d=\"m20 20-3.5-3.5\"/></svg><span>Search</span></a>\n  <a class=\"mn-dock-item\" href=\"#\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M3 13h5l1.5 2h5L16 13h5\"/><path d=\"M5 5h14l2 8v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-6Z\"/></svg><span>Inbox</span></a>\n  <a class=\"mn-dock-item\" href=\"#\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"8\" r=\"4\"/><path d=\"M4 21a8 8 0 0 1 16 0\"/></svg><span>Profile</span></a>\n</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/dock",
  "meta": {
    "mian": {
      "license": "LicenseRef-MIAN-1.0",
      "requiresJs": false,
      "classes": [
        "mn-dock",
        "mn-dock-item",
        "mn-dock-fixed",
        "mn-dock-compact"
      ],
      "accessibility": [
        "Use <nav aria-label=\"…\">. Keep visible labels where you can; with mn-dock-compact every item needs an aria-label.",
        "Targets are at least 48 × 48 px."
      ],
      "intents": [
        "bottom navigation",
        "mobile tab bar",
        "app dock"
      ]
    }
  }
}