{
  "id": "sheet",
  "name": "Sheet",
  "level": "molecule",
  "status": "stable",
  "purpose": "A document pane: one surface divided into sections.",
  "description": "One continuous surface, many sections. A Sheet is a DOCUMENT pane: several regions of one entity that belong on one surface — no gaps between cards, the seam is a divider (hairline on solid, bevelled glass edge on vibrant) and every section owns its padding, chosen once via the sheet's inset. Built ON the Card recipe per the R10 consult (Patterns/Page Shells · DataPage). material=vibrant is the translucent member of ADR-022: it admits the app's ambient backdrop through blur + tint, exists in BOTH light (frosted white) and dark (night glass); high-contrast and prefers-reduced-transparency collapse it to solid. NOT shadcn's Sheet — their side drawer is Poesía's Drawer (ADR-015).",
  "role": "surface",
  "import": "@rrios-forge/ui/molecules/sheet",
  "exports": [
    "Sheet",
    "SheetSection",
    "SheetContext",
    "SHEET_INSETS",
    "SHEET_MATERIALS",
    "sheetSectionVariants",
    "sheetVariants"
  ],
  "source": "packages/ui/src/molecules/sheet",
  "axes": [
    {
      "axis": "material",
      "part": null,
      "values": [
        "solid",
        "vibrant"
      ],
      "default": "vibrant",
      "meaning": "The layer's material (ADR-022, ADR-027)."
    },
    {
      "axis": "inset",
      "part": null,
      "values": [
        "sm",
        "md",
        "lg"
      ],
      "default": "md",
      "meaning": "Inner spacing of a sheet section."
    },
    {
      "axis": "bleed",
      "part": null,
      "values": [
        "true",
        "false"
      ],
      "default": "false",
      "meaning": "Sheet section runs edge to edge."
    }
  ],
  "needs": [
    {
      "need": "Side panel",
      "answer": "`Drawer` or `Sheet`"
    }
  ],
  "patterns": [],
  "a11yExceptions": [],
  "decisions": [
    {
      "id": "ADR-009",
      "title": "Editorial Frame: PageShell v3 + new `TopBar` molecule"
    },
    {
      "id": "ADR-022",
      "title": "The material family: `solid` and `vibrant`"
    },
    {
      "id": "ADR-027",
      "title": "Vibrant is the system's material, not one of its members"
    },
    {
      "id": "ADR-029",
      "title": "The page gutter belongs outside the frame"
    }
  ],
  "stories": [
    {
      "name": "Playground",
      "id": "components-molecules-sheet--playground",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-sheet--playground",
      "frame": "/iframe.html?id=components-molecules-sheet--playground&viewMode=story"
    },
    {
      "name": "Vibrant",
      "id": "components-molecules-sheet--vibrant",
      "interaction": false,
      "snapshots": [
        "dark",
        "high-contrast",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-sheet--vibrant",
      "frame": "/iframe.html?id=components-molecules-sheet--vibrant&viewMode=story"
    },
    {
      "name": "Solid",
      "id": "components-molecules-sheet--solid",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-sheet--solid",
      "frame": "/iframe.html?id=components-molecules-sheet--solid&viewMode=story"
    },
    {
      "name": "Bleed Section",
      "id": "components-molecules-sheet--bleed-section",
      "interaction": false,
      "snapshots": [
        "dark"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-sheet--bleed-section",
      "frame": "/iframe.html?id=components-molecules-sheet--bleed-section&viewMode=story"
    }
  ],
  "storyFile": "tooling/storybook/stories/components/molecules/sheet.stories.tsx"
}