@cakejp/design-system 0.5.0 → 0.7.0

package/dist/types/components/foundations/icon-badge.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+/**
+ * 丸いアイコンバッジ。アイコンを淡いアクセント背景の円で囲む装飾要素。
+ * Card の見出しやリスト項目の先頭に置く「丸アイコン」をDS部品化したもの。
+ *
+ * 設計上の約束:
+ * - **外側 margin を持たない。** 縦間隔は親（Card の `flex-col gap-4`=16px 等）に委ねる。
+ *   バッジ側に `mt-/mb-` を内蔵すると Card の gap と二重がけになり間延びするため。
+ * - アイコン色は `currentColor`（= `--Object-Accent-Primary`）を継承する。
+ *   中の Lucide / iconsax アイコンに `color` を渡す必要はない。
+ * - 内部 SVG のサイズはバッジが固定する（md=20px / lg=38px）。アイコン側の `size` は不要。
+ */
+declare const iconBadgeVariants: (props?: {
+    size?: "lg" | "md";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function IconBadge({ className, size, ...props }: React.ComponentProps<"div"> & VariantProps<typeof iconBadgeVariants>): import("react/jsx-runtime").JSX.Element;
+export { IconBadge, iconBadgeVariants };

package/dist/types/components/primitives/container.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+/**
+ * Container — ページ最大幅と左右余白の唯一の担い手。
+ *
+ * 中央寄せ（`mx-auto`）＋ max-width ＋ 左右 gutter だけを持つ薄いレイアウト primitive。
+ *
+ * 設計上の約束:
+ * - **左右 padding は Container だけが持つ。** これを使うコンポーネント／親（Section 等）は
+ *   自身で左右 padding を持たない。両方が持つと「左右余白の二重がけ」になる（実バグ）。
+ * - 縦余白・背景色は持たない（それは Section の責務）。
+ */
+declare const containerVariants: (props?: {
+    size?: "page" | "narrow" | "wide" | "fluid";
+    gutter?: "none" | "default" | "tight";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function Container({ className, size, gutter, ...props }: React.ComponentProps<"div"> & VariantProps<typeof containerVariants>): import("react/jsx-runtime").JSX.Element;
+export { Container, containerVariants };

package/dist/types/components/primitives/list-item.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-export interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface ListItemProps extends React.HTMLAttributes<HTMLElement> {
     /** メインタイトル */
     title: string;
     /** キャプション（サブテキスト） */
@@ -55,6 +55,9 @@ export interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
  * - アイコン付き: `<ListItem title="注文履歴" leftIcon={<Icon />} size="lg" />`
  * - トグル行: `<ListItem title="通知設定" rightType="toggle" toggleChecked={true} />`
  * - テキスト値付き: `<ListItem title="言語" rightType="text" rightText="日本語" />`
+ *
+ * `href` か `onClick` を渡すとインタラクティブ行になり、hover 背景と focus リングが付く。
+ * 表示専用（href/onClick なし）の行は状態スタイルが付かない。
  */
 declare function ListItem({ title, caption, rightType, rightText, badgeCount, toggleChecked, onToggleChange, leftIcon, leftImageUrl, size, selected, showBorder, showBadgeDot, href, className, ...props }: ListItemProps): import("react/jsx-runtime").JSX.Element;
 export { ListItem };

package/dist/types/components/primitives/section-header.d.ts

@@ -25,6 +25,13 @@ export interface SectionHeaderProps extends React.HTMLAttributes<HTMLDivElement>
     size?: SectionHeaderSize;
     /** 見出しのHTML要素を上書き（デフォルトは size に応じて h1〜h6 を自動選択） */
     as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span";
+    /**
+     * 配置。`start`（既定）はタイトル+もっと見るの左寄せリスト見出し。
+     * `center` はランディング/ガイド系の中央寄せ大見出し（eyebrow + title + subtitle を中央寄せ）。
+     */
+    align?: "start" | "center";
+    /** タイトルの上に置くスロット（Badge 等の eyebrow ラベル）。中央寄せ見出しで特に有用。 */
+    eyebrow?: React.ReactNode;
 }
 /**
  * セクションヘッダーコンポーネント
@@ -46,6 +53,7 @@ export interface SectionHeaderProps extends React.HTMLAttributes<HTMLDivElement>
  * - `as` で見出しレベルを上書き可能（同一ページに h1 が複数必要な場合など）
  * - `moreHref` 指定時はタイトル+サブタイトル全体がリンクになる（クリック領域拡大）
  * - `action` に任意の ReactNode（Button 等）を渡して右側にアクションを配置可能
+ * - `align="center"` でランディング/ガイド系の中央寄せ大見出しに切替（`eyebrow` に Badge 等を載せられる）
  */
-declare function SectionHeader({ className, title, subtitle, moreHref, moreLabel, onMoreClick, action, onPrev, onNext, prevDisabled, nextDisabled, size, as, ...props }: SectionHeaderProps): import("react/jsx-runtime").JSX.Element;
+declare function SectionHeader({ className, title, subtitle, moreHref, moreLabel, onMoreClick, action, onPrev, onNext, prevDisabled, nextDisabled, size, as, align, eyebrow, ...props }: SectionHeaderProps): import("react/jsx-runtime").JSX.Element;
 export { SectionHeader };

package/dist/types/components/primitives/section.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+/**
+ * Section — 全幅の縦リズム＋（任意で）背景色付きの帯。
+ *
+ * 設計上の約束:
+ * - **左右 padding を持たない。** 左右余白は中身の {@link Container} が唯一の担い手。
+ *   背景色は Section（全幅）が持ち、中央寄せは Container が持つ ── この分担により
+ *   「背景帯は画面端まで、コンテンツは中央寄せ」が二重がけなしで成立する。
+ * - 縦余白は SP/PC ペアで `--Space-Section-*` トークンを消費する（rem 直書きの撲滅）。
+ *
+ * 推奨パターン:
+ * ```tsx
+ * <Section spacing="lg" background="subtle">
+ *   <Container>
+ *     <SectionHeader align="center" title="…" />
+ *   </Container>
+ * </Section>
+ * ```
+ */
+declare const sectionVariants: (props?: {
+    spacing?: "sm" | "lg" | "xl" | "md";
+    background?: "none" | "accent-subtle" | "subtle";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function Section({ className, spacing, background, ...props }: React.ComponentProps<"section"> & VariantProps<typeof sectionVariants>): import("react/jsx-runtime").JSX.Element;
+export { Section, sectionVariants };

package/dist/types/index.d.ts

@@ -22,6 +22,7 @@ export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, Dr
 export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./components/foundations/dropdown-menu";
 export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField } from "./components/foundations/form";
 export { HoverCard, HoverCardContent, HoverCardTrigger } from "./components/foundations/hover-card";
+export { IconBadge, iconBadgeVariants } from "./components/foundations/icon-badge";
 export { Input } from "./components/foundations/input";
 export { Label } from "./components/foundations/label";
 export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger } from "./components/foundations/menubar";
@@ -75,6 +76,8 @@ export { ProgressSteps } from "./components/primitives/progress-steps";
 export { QuantitySelector } from "./components/primitives/quantity-selector";
 export { SearchBar } from "./components/primitives/search-bar";
 export { SearchPanel } from "./components/primitives/search-panel";
+export { Container, containerVariants } from "./components/primitives/container";
+export { Section, sectionVariants } from "./components/primitives/section";
 export { SectionHeader } from "./components/primitives/section-header";
 export { ShareButtons } from "./components/primitives/share-buttons";
 export { SideNav } from "./components/primitives/side-nav";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cakejp/design-system",
-  "version": "0.5.0",
+  "version": "0.7.0",
   "type": "module",
   "description": "Cake.jp Design System — UI コンポーネント・カラートークン・タイポグラフィ",
   "license": "UNLICENSED",
@@ -31,15 +31,11 @@
     "cakejp-ds": "./bin/init.js"
   },
   "files": [
-    "AGENTS.md",
     "CHANGELOG.md",
     "CLAUDE.md",
     "CLAUDE_PRODUCTION.md",
     "MIGRATION.md",
-    "PUBLISHING.md",
-    "RELEASE.md",
     "bin",
-    "component-registry.json",
     "contracts",
     "dist",
     "scripts/codemod",
@@ -81,6 +77,7 @@
     "build": "tsc -b && vite build",
     "build:lib": "vite build --config vite.config.lib.ts && tsc --project tsconfig.lib.json && tsc-alias --project tsconfig.lib.json",
     "prepack": "npm run build:lib",
+    "prepare": "npm run build:lib",
     "postinstall": "node ./bin/init.js postinstall",
     "lint": "eslint .",
     "preview": "vite preview",
@@ -88,8 +85,10 @@
     "build-storybook": "storybook build",
     "lint:scratch": "bash scripts/lint-scratch.sh",
     "lint:reuse": "bash scripts/check-story-reuse.sh",
+    "lint:border": "node scripts/check-border-color.mjs",
     "generate:lint-rules": "node scripts/generate-lint-rules.mjs",
-    "check": "tsc --noEmit && bash scripts/check-deps.sh && bash scripts/check-drift.sh && bash scripts/lint-scratch.sh && bash scripts/check-story-reuse.sh && bash scripts/check-responsive.sh",
+    "generate:lookup": "node scripts/generate-component-lookup.mjs",
+    "check": "tsc --noEmit && bash scripts/check-deps.sh && bash scripts/check-drift.sh && bash scripts/lint-scratch.sh && bash scripts/check-story-reuse.sh && bash scripts/check-responsive.sh && node scripts/check-border-color.mjs && bash scripts/lint-scratch.sh --components && bash scripts/check-generated-drift.sh",
     "test": "vitest run --config vitest.config.ts"
   },
   "dependencies": {

package/src/preset-standalone.css

@@ -18,6 +18,7 @@
  *   - Semantic カラートークン（--Text-*, --Surface-*, --Border-* 等）
  *   - ダークモード自動切替（.dark クラス）
  *   - shadcn bridge トークン（--primary, --foreground 等）
+ *   - spacing / セクション余白トークン
  *   - シャドウ・角丸トークン
  *
  * タイポグラフィ（typo-*）は Tailwind v4 の @utility に依存するため、
@@ -33,6 +34,20 @@
 
 /* --- Bridge: Semantic → shadcn tokens --- */
 :root {
+  --spacing-1: 0.25rem;   /* 4px - scale 1 */
+  --spacing-2: 0.5rem;    /* 8px - scale 2 */
+  --spacing-3: 0.75rem;   /* 12px - scale 3 */
+  --spacing-4: 1rem;      /* 16px - scale 4 */
+  --spacing-5: 1.25rem;   /* 20px - interpolated */
+  --spacing-6: 1.5rem;    /* 24px - scale 6 */
+
+  --Space-Section-xs: 2rem;    /* 32px - セクション間ギャップSP / カード上下 */
+  --Space-Section-sm: 2.5rem;  /* 40px - セクションpadding SP */
+  --Space-Section-md: 3rem;    /* 48px - Final CTA 上 */
+  --Space-Section-lg: 3.5rem;  /* 56px - セクションpadding PC */
+  --Space-Section-xl: 4rem;    /* 64px - HERO上下 / Final CTA下SP */
+  --Space-Section-2xl: 5rem;   /* 80px - Final CTA下PC */
+
   --radius: 0.625rem;
 
   --background: var(--Surface-Primary);

package/src/preset.css

@@ -189,6 +189,15 @@
   --spacing-5: 1.25rem;   /* 20px - interpolated */
   --spacing-6: 1.5rem;    /* 24px - scale 6 */
 
+  /* Section 余白 tier（セクション縦リズム・8の倍数。spacing.scale の 24px 上限を超える領域）
+     用途別の意味的トークン。Section プリミティブと、生CSS/HTML モックの rem 直書き置換に使う。 */
+  --Space-Section-xs: 2rem;    /* 32px - セクション間ギャップSP / カード上下 */
+  --Space-Section-sm: 2.5rem;  /* 40px - セクションpadding SP */
+  --Space-Section-md: 3rem;    /* 48px - Final CTA 上 */
+  --Space-Section-lg: 3.5rem;  /* 56px - セクションpadding PC */
+  --Space-Section-xl: 4rem;    /* 64px - HERO上下 / Final CTA下SP */
+  --Space-Section-2xl: 5rem;   /* 80px - Final CTA下PC */
+
   --radius: 0.625rem;
 
   --background: var(--Surface-Primary);

package/templates/AGENTS.md

@@ -11,7 +11,7 @@ Codex（および他の AI エージェント）は UI 作業を始める前に
 
 | ファイル | 内容 |
 |---------|------|
-| `node_modules/@cakejp/design-system/AGENTS.md` | DS 全体のルール・禁止パターン |
+| `node_modules/@cakejp/design-system/CLAUDE.md` | DS 利用ガイド・禁止パターン |
 | `node_modules/@cakejp/design-system/contracts/components.json` | 全コンポーネントの定義・バリアント |
 | `node_modules/@cakejp/design-system/contracts/rules.json` | 禁止パターン・アクセシビリティ要件 |
 | `node_modules/@cakejp/design-system/tokens.json` | カラー・余白・角丸・影・タイポ |

package/templates/CLAUDE.md

@@ -11,7 +11,7 @@ Codex（および他の AI エージェント）は UI 作業を始める前に
 
 | ファイル | 内容 |
 |---------|------|
-| `node_modules/@cakejp/design-system/AGENTS.md` | DS 全体のルール・禁止パターン |
+| `node_modules/@cakejp/design-system/CLAUDE.md` | DS 利用ガイド・禁止パターン |
 | `node_modules/@cakejp/design-system/contracts/components.json` | 全コンポーネントの定義・バリアント |
 | `node_modules/@cakejp/design-system/contracts/rules.json` | 禁止パターン・アクセシビリティ要件 |
 | `node_modules/@cakejp/design-system/tokens.json` | カラー・余白・角丸・影・タイポ |

package/tokens.json

@@ -96,6 +96,15 @@
       "3":   { "px": 12, "usage": "セクション内要素間" },
       "4":   { "px": 16, "usage": "セクション間" },
       "6":   { "px": 24, "usage": "ダイアログ内パディング" }
+    },
+    "section": {
+      "comment": "セクション縦リズム tier（8の倍数）。preset.css の --Space-Section-* に対応。Section プリミティブが SP/PC ペアで消費する。scale(最大24px) を超える領域専用",
+      "xs":  { "px": 32, "var": "--Space-Section-xs",  "usage": "セクション間ギャップSP / カード上下" },
+      "sm":  { "px": 40, "var": "--Space-Section-sm",  "usage": "セクションpadding SP" },
+      "md":  { "px": 48, "var": "--Space-Section-md",  "usage": "Final CTA 上" },
+      "lg":  { "px": 56, "var": "--Space-Section-lg",  "usage": "セクションpadding PC" },
+      "xl":  { "px": 64, "var": "--Space-Section-xl",  "usage": "HERO上下 / Final CTA下SP" },
+      "2xl": { "px": 80, "var": "--Space-Section-2xl", "usage": "Final CTA下PC" }
     }
   },
 
@@ -113,15 +122,21 @@
     "md": "calc(var(--radius) - 2px)",
     "lg": "var(--radius)",
     "xl": "calc(var(--radius) + 4px)",
-    "base": "0.625rem"
+    "2xl": "calc(var(--radius) + 8px)",
+    "3xl": "calc(var(--radius) + 12px)",
+    "4xl": "calc(var(--radius) + 16px)",
+    "base": "0.625rem",
+    "_comment": "--radius=10px 基準。px換算: sm=6 md=8 lg=10 xl=14 2xl=18 3xl=22 4xl=26。利用可は xs(2,Tailwind既定)〜2xl + full。3xl/4xl は定義のみで利用禁止（rules.json AI7）"
   },
 
   "shadow": {
-    "md":      "0 2px 6px 0 rgba(0,0,0,0.08)",
-    "lg":      "0 4px 12px 0 rgba(0,0,0,0.12)",
-    "menu":    "0 4px 16px 0 rgba(0,0,0,0.12)",
-    "tooltip": "0 2px 8px 0 rgba(0,0,0,0.16)",
-    "dialog":  "0 8px 24px 0 rgba(0,0,0,0.16)",
-    "modal":   "0 16px 48px 0 rgba(0,0,0,0.24)"
+    "md":      "0px 7px 7px 0px rgba(0, 0, 0, 0.07), 0px 2px 16px 0px rgba(0, 0, 0, 0.12)",
+    "lg":      "0px 12px 32px -4px rgba(24, 39, 75, 0.12), 0px 8px 16px -6px rgba(24, 39, 75, 0.12), 0px 1px 4px 1px rgba(0, 0, 0, 0.2)",
+    "menu":    "var(--shadow-md)",
+    "tooltip": "0px 8px 8px -4px rgba(24, 39, 75, 0.08), 0px 4px 6px -4px rgba(24, 39, 75, 0.12)",
+    "dialog":  "var(--shadow-lg)",
+    "modal":   "var(--shadow-lg)",
+    "overlay": "0 24px 80px rgba(24, 39, 75, 0.16)",
+    "_comment": "preset.css の --shadow-* と同期（正）。md/lg は Tailwind 既定を DS 値に再定義済み。xl/2xl は使用禁止（rules.json R53）"
   }
 }

package/AGENTS.md

@@ -1,144 +0,0 @@
-# Cake.jp Design System — AGENTS.md（Codex向け）
-
-## このDSについて
-
-Cake.jp のフロントエンドとデザインシステムを正式に接続する統合デザインシステム。
-EC / BtoC / コマース向け。**3-tier 構造で 104 コンポーネント**:
-- foundations: 46個（shadcn ベース汎用 UI）
-- primitives: 35個（業界汎用パターン・jobboard 等他事業でも再利用可）
-- ec: 23個（Cake.jp / EC 事業特化）
-
----
-
-## 必須: セッション開始時に読み込むファイル
-
-Codex はファイルを自動読み込みしないため、**タスク開始前に以下を明示的に読み込むこと**:
-
-```
-1. contracts/rules.json        # 禁止パターン・アクセシビリティ要件
-2. contracts/components.json   # 全104コンポーネント定義（3-tier）
-3. tokens.json                 # カラー・タイポグラフィ・スペーシングトークン
-```
-
-本番実装・新規コンポーネント作成の場合はさらに:
-```
-4. CLAUDE_PRODUCTION.md        # 本番参照ルール・Figmaチェックリスト
-```
-
----
-
-## 技術スタック
-
-- React 19 + TypeScript
-- Vite（ビルド）
-- **Tailwind CSS v4**（`@import "tailwindcss"` 構文。`@tailwind base` / `@tailwind components` は v3 記法で**使用禁止**）
-- shadcn/ui（Radix UI ベース、Cake.jp テーマ適用済み）
-- Storybook（`@storybook/react-vite`）
-- CVA（class-variance-authority）でバリアント管理
-- **Lucide React + iconsax-react**（アイコン。`heroicons` `phosphor-icons` への置き換え禁止）
-
----
-
-## ディレクトリ構成
-
-```
-src/
-├── components/
-│   ├── foundations/ # shadcn ベース汎用 UI（46個・全事業共通）
-│   ├── primitives/  # 業界汎用パターン（35個・jobboard等他事業でも再利用可）
-│   ├── ec/          # Cake.jp / EC 事業特化（23個・商品・配送・クーポン等）
-│   └── pages/       # ページ単位のストーリー
-├── prototypes/      # /mock スキルで生成されたプロトタイプ
-├── lib/
-│   └── utils.ts     # cn() ユーティリティ
-└── index.css        # カラートークン定義 + Tailwind 設定
-```
-
-### 3層構造の依存ルール
-
-```
-ec/         ← Cake.jp 特化（最上位）
-  ↓
-primitives/ ← 業界汎用パターン
-  ↓
-foundations/ ← shadcn ベース（最下位）
-```
-
-- `foundations/` は他層に依存しない
-- `primitives/` は `foundations/` のみ参照可
-- `ec/` は `foundations/` と `primitives/` を参照可
-- **逆方向の依存は禁止**（`bash scripts/check-deps.sh` で検証）
-
----
-
-## ❌ スクラッチコード禁止ルール（強制）
-
-### 書く前ゲート
-
-以下のいずれかを書こうとしたら**手を止めて** `contracts/components.json` と Storybook で同等パターンを探すこと:
-
-| 書こうとしているもの | 確認先 |
-|-------------------|--------|
-| `::before` / `::after` 装飾（バー・ドット・矢印） | SectionHeader, Chip, Badge, ListItem の variants |
-| `rgba(...)` / `#xxxxxx` ハードコードカラー | `tokens.json` のトークン名を使う |
-| `box-shadow: ...` カスタム影 | `tokens.json` の `shadow.*` |
-| `border-radius: ...px` カスタム角丸 | `tokens.json` の `radius.*` |
-| カスタムフォントサイズ・ウェイト | `tokens.json` の `typography.*` |
-
-DSに存在しない場合のみカスタム実装を許可。その場合はコメントで理由を記載すること。
-
-### 書いた後ゲート（強制）
-
-**.tsx / .css / .module.css を編集したら必ず実行**:
-
-```bash
-bash scripts/lint-scratch.sh
-```
-
-エラーが出たら修正してから次のタスクに進むこと。**エラーありのまま完了報告禁止。**
-
-**コンポーネントを追加・削除したら必ず実行**:
-
-```bash
-bash scripts/check-drift.sh   # contracts と実ファイルの一致を検証
-bash scripts/check-deps.sh    # 3-tier 依存方向違反を検出
-```
-
-`contracts/components.json` の `meta.counts` と実ファイル数が一致していること、
-foundations → primitives → ec の依存方向が正しいことを確認すること。
-
----
-
-## コンポーネント追加時のチェックリスト
-
-- [ ] `src/index.tsx` にエクスポートを追加
-- [ ] `contracts/components.json` にコンポーネント定義を追加
-- [ ] `contracts/components.json` の `meta.counts` を更新
-- [ ] `bash scripts/check-drift.sh` を実行して乖離がないことを確認
-- [ ] Storybook のストーリーファイル（`.stories.tsx`）を作成
-
----
-
-## ドキュメント構成
-
-| ファイル | 内容 |
-|---------|------|
-| **AGENTS.md**（本ファイル） | Codex向け。セッション開始時の読み込み指示・編集後コマンドを明記 |
-| **CLAUDE.md** | Claude Code向け概要（フック自動実行） |
-| **contracts/components.json** | 全104コンポーネントの構造化定義（3-tier・バリアント・アクセシビリティ要件） |
-| **contracts/rules.json** | 禁止パターン・アクセシビリティ要件・タイポグラフィ定義 |
-| **tokens.json** | カラー・スペーシング・シャドウトークンの機械可読定義 |
-| **CLAUDE_PRODUCTION.md** | 本番実装参照ルール・Figmaチェックリスト（Cake.jp固有） |
-
----
-
-## 重要な制約（AI生成コードの典型的な誤り）
-
-`contracts/rules.json` の `aiPatterns` セクションで詳細を確認すること。主な注意点:
-
-- **価格表記**: `¥{数字,区切り}（税込）` — `円` `税込み` `(税込)` は禁止
-- **日付表記**: `M月D日（曜日）` — `YYYY/MM/DD` や英語表記禁止
-- **aria-label**: 日本語で記述 — 英語 aria-label 禁止
-- **input type="date"**: 使用禁止 — PopoverとCalendarを組み合わせる
-- **Tag に onClick**: 禁止 — 押せるものは Chip を使う
-- **SectionHeader 手書き**: 禁止 — `SectionHeader` コンポーネントを使う

package/PUBLISHING.md

@@ -1,106 +0,0 @@
-# 公開とタグ付け（人向けクイックガイド）
-
-@cakejp/design-system を npm に公開する方法と、Git タグの仕組みについて。
-
-詳しい運用ルール（曜日・週次フロー等）は [`RELEASE.md`](./RELEASE.md) を参照。
-
----
-
-## 結論 — やること
-
-1. **main に変更をマージ**（PR 経由）
-2. **`package.json` の `version` を上げる**（例: `0.3.3` → `0.3.4`）
-3. **`gh workflow run publish.yml -f dry_run=false`** を実行
-   → 自動で npm publish + Git タグ作成（`v0.3.4`）まで一気にやる
-
-タグは **手動で打たない**。Action が自動で作る。
-
----
-
-## アクション（GitHub Actions）の実行方法
-
-### A. GitHub の Web UI からポチる
-
-1. https://github.com/flashpark/cake-design-system にアクセス
-2. 上の「**Actions**」タブをクリック
-3. 左サイドバーの「**Publish to npm**」を選択
-4. 右上の「**Run workflow**」ボタン
-5. ダイアログで `Branch: main` のまま、`Dry run` のチェックは外す
-6. 緑の「**Run workflow**」を押す
-
-### B. ターミナルから一発
-
-```bash
-# 念のため事前確認（npm publish --dry-run のみ実行、本番に影響なし）
-gh workflow run publish.yml -f dry_run=true
-
-# 本番 publish + タグ作成
-gh workflow run publish.yml -f dry_run=false
-```
-
----
-
-## タグ付けはどうなってる？
-
-### 自動
-
-`gh workflow run publish.yml` 実行時に **デフォルトで Git タグ `v{version}` が自動作成・push** される。
-
-- `package.json` の `version: 0.3.4` で実行 → `v0.3.4` タグが main にぶら下がる
-- 既にタグ存在する場合は skip（重複エラーにならない）
-
-### 手動で打ちたいケース
-
-通常は不要。やるなら：
-
-```bash
-git tag v0.3.4
-git push origin v0.3.4
-```
-
-### タグを作らずに publish したい
-
-`tag_after_publish: false` を指定:
-
-```bash
-gh workflow run publish.yml -f dry_run=false -f tag_after_publish=false
-```
-
----
-
-## 何が公開されたか確認
-
-```bash
-# npm に反映されたか
-npm view @cakejp/design-system version
-# → 例: 0.3.4
-
-# 全 version 一覧
-npm view @cakejp/design-system versions
-
-# タグ一覧
-git fetch --tags origin
-git tag --list | sort -V
-```
-
-公開直後は npm のキャッシュ反映に **30〜90 秒**かかる。
-
----
-
-## トラブルシュート
-
-| 症状 | 確認 |
-|------|------|
-| Action 実行できない | Settings > Actions > Workflow permissions が `Read and write` か |
-| publish が失敗する | NPM_TOKEN が有効期限切れの可能性 |
-| タグが作られない | Workflow ログで「Create release tag」step を確認 |
-| 「金曜にやるな」と怒られる | [`RELEASE.md`](./RELEASE.md) の Read-Only Friday ルール参照 |
-
----
-
-## 関連ドキュメント
-
-- [`RELEASE.md`](./RELEASE.md) — 詳細運用ルール（曜日・チェックリスト・緊急 hotfix 等）
-- [`CHANGELOG.md`](./CHANGELOG.md) — 各バージョンの変更履歴
-- [`MIGRATION.md`](./MIGRATION.md) — メジャーバージョンの移行手順
-- [`.github/workflows/publish.yml`](./.github/workflows/publish.yml) — Workflow 定義