Drop page / section descriptions, state notes and repeated captions from the representative Stories of 44 components, the Patterns, Center Graphic and OrgChart pages. Value readouts, spec lists and captions hide only on the representative page; hidden verification Stories keep them. Tabs Default API and the Filter Bar draft / applied counts move to the hidden DefaultApi and DraftApplied Stories; Center Overview is hidden with its direct URL kept. Story IDs are unchanged. Align the component, pattern and OrgChart docs with the pages, point the quality reference check at the DraftApplied Story, and make the P8 styles check expect no section header on the preview-only Expanded page.
43 lines
1.9 KiB
TypeScript
43 lines
1.9 KiB
TypeScript
import type { Meta, StoryObj } from "@storybook/react-vite"
|
|
import { CenterTitle, CENTER_TITLE_COMPOSITIONS, type CenterTitleComposition } from "@hm-design/center-graphic"
|
|
import { CenterTitleReferenceDemo } from "@hm-design/center-graphic/reference"
|
|
import { StoryPage, StoryPageHeader, StorySection } from "@/components/story-page"
|
|
import { withRepresentation } from "./center-shared"
|
|
|
|
// Owner: ui-viz docs/components/center-title.md. Title Resolution B numeric output is TBD; the per-Type palette is SCOPED_DESIGN_APPROVAL.
|
|
const meta = {
|
|
title: "Center Graphic/Title",
|
|
component: CenterTitle,
|
|
parameters: { layout: "padded" },
|
|
} satisfies Meta<typeof CenterTitle>
|
|
export default meta
|
|
type Story = StoryObj<typeof meta>
|
|
|
|
// Representative Story: the four title types. Named after the area so Storybook shows it as a single sidebar item.
|
|
// Common Story page. The CENTER representation wraps only the specimen, so the page title is never scaled with the graphic.
|
|
export const Compositions: Story = {
|
|
name: "Title",
|
|
parameters: { layout: "fullscreen", controls: { disable: true } },
|
|
render: () => (
|
|
<StoryPage>
|
|
<StoryPageHeader title="Title" />
|
|
<StorySection title="Overview">
|
|
{withRepresentation(() => <CenterTitleReferenceDemo />)}
|
|
</StorySection>
|
|
</StoryPage>
|
|
),
|
|
}
|
|
|
|
export const Playground: Story = {
|
|
tags: ["verification"],
|
|
decorators: [withRepresentation],
|
|
args: { composition: "routeProjectNameRoute", context: "서산영덕선", projectName: "대산~당진 건설공사", routeClassification: "고속국도 제30호", projectRoute: "L=25.36km" },
|
|
argTypes: {
|
|
composition: {
|
|
control: { type: "select", labels: Object.fromEntries(Object.entries(CENTER_TITLE_COMPOSITIONS).map(([key, { type, label }]) => [key, `${type} · ${label}`])) },
|
|
options: Object.keys(CENTER_TITLE_COMPOSITIONS) as CenterTitleComposition[],
|
|
},
|
|
},
|
|
render: (args) => <CenterTitle {...args} />,
|
|
}
|