Initial commit: HMDesignSystem baseline

src/center/center-information.stories.tsx

@@ -0,0 +1,34 @@
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import { CenterInformationDisplayReferenceDemo } from "@hm-design/center-graphic/reference"
+import { STORY_KICKER, StoryPage, StoryPageHeader, StorySection } from "@/components/story-page"
+import { CENTER_BOUNDARY, withRepresentation } from "./center-shared"
+
+// Owner: ui-viz docs/patterns/center-information-presentation.md and center-information-{box,table,emphasis}.md.
+// Single-line ellipsis is resolved; multi-line overflow, exact placement and the presentation scale (Q3) are not.
+const meta = {
+  title: "Center Graphic/Information",
+  parameters: { layout: "fullscreen", controls: { disable: true } },
+} satisfies Meta
+export default meta
+type Story = StoryObj<typeof meta>
+
+// Common Story page. The CENTER representation wraps only the specimen, so the page title is never scaled with the graphic.
+export const Information: Story = {
+  name: "Information",
+  render: () => (
+    <StoryPage>
+      <StoryPageHeader
+        kicker={STORY_KICKER.center}
+        title="Information"
+        description="CENTER 정보 표시(Box · Table · Emphasis) Reference입니다. 단일행 말줄임만 해결된 상태이며 배율(Q3)은 정해지지 않았습니다."
+      />
+      <StorySection title="Overview" description={CENTER_BOUNDARY}>
+        {withRepresentation(() => (
+          <div className="sb-center-information">
+            <CenterInformationDisplayReferenceDemo />
+          </div>
+        ))}
+      </StorySection>
+    </StoryPage>
+  ),
+}