{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "date-range",
  "type": "registry:ui",
  "title": "Date range (MIAN)",
  "description": "Pick a period for a report: presets for the common ranges and two dates for anything else.",
  "categories": [
    "forms",
    "date range",
    "period picker",
    "last 7 days",
    "last 30 days"
  ],
  "registryDependencies": [
    "https://mian.ro/r/mian-base.json"
  ],
  "files": [
    {
      "path": "mian/components/date-range.css",
      "type": "registry:file",
      "target": "mian/components/date-range.css",
      "content": ".mn-daterange { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; min-width: 0; }\n.mn-daterange-custom { display: flex; align-items: center; gap: .4rem; color: var(--mn-muted); font-size: var(--mn-text-sm); }\n.mn-daterange-custom .mn-input { width: auto; min-width: 8.5rem; }"
    },
    {
      "path": "mian/examples/date-range.html",
      "type": "registry:file",
      "target": "mian/examples/date-range.html",
      "content": "<!-- Report period -->\n<div class=\"mn-daterange\" data-mn-daterange>\n  <div class=\"mn-toggle-group\" role=\"group\" aria-label=\"Period\"><button type=\"button\" data-mn-range=\"7\" aria-pressed=\"false\">7 days</button><button type=\"button\" data-mn-range=\"30\" aria-pressed=\"true\">30 days</button><button type=\"button\" data-mn-range=\"90\" aria-pressed=\"false\">90 days</button></div>\n  <div class=\"mn-daterange-custom\"><input class=\"mn-input mn-input-sm\" type=\"date\" aria-label=\"From\"><span>to</span><input class=\"mn-input mn-input-sm\" type=\"date\" aria-label=\"To\"></div>\n</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/date-range",
  "meta": {
    "mian": {
      "license": "LicenseRef-MIAN-1.0",
      "requiresJs": true,
      "classes": [
        "mn-daterange",
        "data-mn-range",
        "mn-daterange-custom"
      ],
      "accessibility": [
        "Presets are toggle buttons (aria-pressed) in a labelled group.",
        "Both dates are native date inputs with their own labels, so they work with any keyboard and locale.",
        "Listen for mn:change; detail has from, to and days."
      ],
      "intents": [
        "date range picker",
        "report period",
        "last 30 days filter",
        "from and to dates"
      ]
    }
  }
}