Initial commit: HMDesignSystem baseline

src/center/center-spatial.stories.tsx

@@ -0,0 +1,32 @@
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import { RouteLine } from "@hm-design/center-graphic"
+import { CenterSpatialInformationReferenceDemo } from "@hm-design/center-graphic/reference"
+import { STORY_KICKER, StoryPage, StoryPageHeader, StorySection } from "@/components/story-page"
+import { CENTER_BOUNDARY, withRepresentation } from "./center-shared"
+
+// Owners: ui-viz docs/visualization/route.md, spatial-map.md, spatial-section.md, composition.md.
+// Route layer order Shadow -> Outline -> Primary Stroke is CONFIRMED; the whole-map layer order is Candidate and line join is TBD.
+const meta = {
+  title: "Center Graphic/Spatial",
+  component: RouteLine,
+  parameters: { layout: "fullscreen", controls: { disable: true } },
+} satisfies Meta<typeof RouteLine>
+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 Spatial: Story = {
+  name: "Spatial",
+  render: () => (
+    <StoryPage className="sb-center-spatial-page">
+      <StoryPageHeader
+        kicker={STORY_KICKER.center}
+        title="Spatial"
+        description="CENTER 노선·공간 정보 Reference입니다. 노선 레이어 순서(Shadow → Outline → Primary Stroke)는 확정이며, 전체 지도 레이어 순서는 Candidate, line join은 TBD입니다."
+      />
+      <StorySection title="Overview" description={CENTER_BOUNDARY}>
+        {withRepresentation(() => <CenterSpatialInformationReferenceDemo />)}
+      </StorySection>
+    </StoryPage>
+  ),
+}