style(storybook): group overlay, disclosure and navigation story pages

- Sheet + Drawer, Tooltip + Hover Card, Accordion + Collapsible,
  Dialog + Alert Dialog, Dropdown Menu + Context Menu on one page each
  (specimens moved to *-examples.tsx; absorbed Stories keep their IDs)
- Popover, Tabs content spacing, Breadcrumb, Menubar and Command tidied
- Component docs updated to the new representative pages

src/components/sheet.stories.tsx

@@ -4,6 +4,7 @@ import type { Meta, StoryObj } from "@storybook/react-vite"
 import { Button, Input, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "@hm-design/ui"
 import { StateBoard, type BoardState } from "@/components/story-board"
 import { StoryPage, StoryPageHeader, StorySection } from "@/components/story-page"
+import { DrawerSections } from "./drawer-examples"
 
 // Sheet is a modal Radix overlay (Portal), so the representative Story is a row of triggers that open the real Sheet for each
 // side and content case. The same cases start open in the verification Stories. Radix owns focus trap, Escape and focus return.
@@ -94,21 +95,20 @@ const meta = { title: "Components/Overlay/Sheet", component: Sheet, parameters:
 export default meta
 type Story = StoryObj<typeof meta>
 
-// Representative-page layout (Storybook presentation only): equal columns on PC (iframe width 1000px and up), fewer below that
-// (200px minimum). Each specimen sits in its own single-column StateBoard (min larger than any column), so every subtitle and divider
-// has the width of its column; a section with fewer specimens than columns leaves the remaining columns empty. The trigger keeps its
-// own size (the wrapper div stretches, the inline-flex trigger does not). Overlays open in a portal, so this layout never affects them.
-function SpecimenGrid({ states, columns = 4 }: { states: BoardState[]; columns?: 4 | 5 }) {
+// Keep the board's accessible headings and shared indent, with only the triggers visible in the four-column grid.
+function SpecimenGrid({ states }: { states: BoardState[] }) {
   return (
-    <div className={`grid items-start gap-6 [grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr))] ${columns === 5 ? "min-[1000px]:grid-cols-5" : "min-[1000px]:grid-cols-4"}`}>
+    <div className="grid items-start gap-6 [grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr))] min-[1000px]:grid-cols-4 [&_[data-overview-state]>header]:sr-only">
       {states.map((state) => (
-        <StateBoard key={state.id} min={10000} states={[{ ...state, children: <div>{state.children}</div> }]} />
+        <StateBoard key={state.id} min={10000} states={[{ ...state, children: <div className="flex items-start">{state.children}</div> }]} />
       ))}
     </div>
   )
 }
 
 // Representative Story: the common Story page. Overview is merged into Variants (Right is its first item).
+// 2026-11-13 (user request): it also shows the Drawer section from ./drawer-examples, so "시트·드로어" is the one sidebar item
+// for both edge panels; the Drawer Stories keep their IDs and direct URLs but are hidden from the sidebar.
 export const All: Story = {
   name: "Sheet",
   parameters: { layout: "fullscreen", controls: { disable: true } },
@@ -133,6 +133,7 @@ export const All: Story = {
           ]}
         />
       </StorySection>
+      <DrawerSections title="Drawer" idPrefix="drawer-" hideSpecimenLabels />
     </StoryPage>
   ),
 }