docs(storybook): simplify sidebar Story pages around the UI

Drop the category kicker from the 83 sidebar Stories (kicker is now optional;
hidden verification Stories keep it) and shorten or remove repeated, obvious
or internal page/section descriptions. Required specs, limits, virtual-data
and undecided-value notices stay. Story IDs, exports, fixtures, shared state
notes and package code are unchanged. Record: docs/reports/storybook-ui-simplification-2026-10-22.md
This commit is contained in:
shkim4 committed 2026-10-22 16:13:58 +09:00
1 parent aa8b7f8df1
commit da0e647b49
70 files changed
+305 -333

No files matched your search

+4 -6
View File
@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from "@storybook/react-vite"
// Usage: preserved native label fixtures do not define a new-screen exception. Use public Label
// for supported fields (docs/components/label.md §5); copy only actions requested by the screen.
import { Button, Input, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "@hm-design/ui"
import { STORY_KICKER, StoryPage, StoryPageHeader, StorySection } from "@/components/story-page"
import { StoryPage, StoryPageHeader, StorySection } from "@/components/story-page"
// 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.
@@ -99,21 +99,19 @@ export const All: Story = {
render: () => (
<StoryPage>
<StoryPageHeader
kicker={STORY_KICKER.components}
title="Sheet"
description="화면 가장자리에서 열리는 보조 모달 패널입니다. 각 버튼을 눌러 실제 Sheet를 엽니다."
/>
<StorySection title="Overview" description="side를 생략한 기본 방향(right)입니다.">
<StorySection title="Overview" description="기본값: right">
<SideCase side="right" />
</StorySection>
<StorySection title="Variants" description="side: left / top / bottom.">
<StorySection title="Variants">
<div className="flex flex-wrap gap-3">
<SideCase side="left" />
<SideCase side="top" />
<SideCase side="bottom" />
</div>
</StorySection>
<StorySection title="Usage" description="폼 입력 조합과, 내용이 길 때 Body만 scroll 하는 경우입니다.">
<StorySection title="Usage" description="긴 내용은 Body만 scroll">
<div className="flex flex-wrap gap-3">
<FormCase />
<LongCase />