@cakejp/design-system 0.6.0 → 0.9.0

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/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 定義

package/RELEASE.md

@@ -1,205 +0,0 @@
-# Release Process
-
-@cakejp/design-system のリリース運用ルール。
-
----
-
-## 🗓 基本方針
-
-- **週 1 回・手動リリース** を原則とする
-- 自動 publish は無効化済み（タグ push しても何も起きない）
-- **金曜は publish しない**（万一トラブった時に対応できる人がいないため）
-- 緊急パッチは個別に手動実行
-
-### 標準スケジュール
-
-| 曜日 | 内容 |
-|---|---|
-| 月〜木 | 開発・PR レビュー・main マージ |
-| **金曜** | リリース確認・取りまとめ・version bump（コミットまで）<br>**publish はしない** |
-| 土・日 | お休み |
-| **月曜** | npm publish 実行 → 利用側で動作確認 |
-| 火〜木 | 問題があれば patch リリース対応 |
-
-### この運用にする理由
-
-- **Read-Only Friday**: 金曜は本番 publish しない（業界慣習）
-- 障害発生時に **対応できるエンジニアが翌営業日まで動ける** 状態でリリース
-- 利用側 (cake-api/frontend 等) も **週初めから安心して install** できる
-- 金曜時点で「意味ある単位にまとまっているか」を確認できれば、月曜の publish はスムーズ
-
----
-
-## 📦 リリース手順
-
-### 金曜 (確認のみ・publish はしない)
-
-1. main の差分を確認
-2. CHANGELOG.md を整理（minor/patch 判断）
-3. 必要なら version bump コミットだけ作る → main に push
-4. **ここで publish はせず、月曜の作業に残す**
-
-### 月曜 (publish 実行)
-
-1. main 最新を pull
-2. dry-run で事前確認
-3. 本番 publish
-4. cake-api/frontend で動作確認
-5. Slack で告知
-
----
-
-### 詳細手順
-
-### 1. リリース対象の取りまとめ
-
-```bash
-# main にマージ済みの差分を確認
-git log v$(npm view @cakejp/design-system version)..main --oneline
-```
-
-「意味ある単位」になっているか確認:
-- 機能追加・破壊的変更が複数ある → minor bump (`0.3.0` → `0.4.0`)
-- バグ修正のみ → patch bump (`0.3.0` → `0.3.1`)
-- 互換性ある内部改善のみ → patch bump
-
-### 2. version bump
-
-```bash
-# patch リリース
-npm version patch -m "chore(release): v%s"
-
-# minor リリース
-npm version minor -m "chore(release): v%s"
-
-# major リリース（注意）
-npm version major -m "chore(release): v%s"
-```
-
-`npm version` は package.json と package-lock.json を更新し、
-コミット作成までやってくれる。タグ作成は workflow 側でやるので
-`--no-git-tag-version` を付けたい場合は手動コミット。
-
-### 3. CHANGELOG.md / MIGRATION.md 更新
-
-破壊的変更・新機能・バグ修正の概要を CHANGELOG に追記。
-
-### 4. main に push
-
-```bash
-git push origin main
-```
-
-### 5. dry-run で事前検証
-
-```bash
-gh workflow run publish.yml -f dry_run=true
-```
-
-または GitHub UI で **Actions > Publish to npm > Run workflow** から実行。
-失敗ログを確認し、問題なければ次へ。
-
-### 6. 本番 publish
-
-```bash
-gh workflow run publish.yml -f dry_run=false -f tag_after_publish=true
-```
-
-または GitHub UI で実行。
-Workflow が npm publish + `v{version}` タグ作成を自動でやる。
-
-### 7. リリース後の確認
-
-```bash
-# npm に反映確認
-npm view @cakejp/design-system@$(node -p "require('./package.json').version")
-
-# 利用側で install 確認
-cd ../cake-api/frontend
-npm install @cakejp/design-system@latest
-```
-
----
-
-## 🚨 緊急パッチ
-
-平日でもセキュリティ脆弱性・本番障害対応のパッチは即時リリース可能:
-
-```bash
-# 1. fix ブランチ
-git checkout -b fix/critical-issue main
-# ... 修正
-
-# 2. PR → 緊急マージ
-gh pr create --base main --title "fix: critical security issue"
-gh pr merge --squash
-
-# 3. patch bump
-git checkout main && git pull
-npm version patch -m "chore(release): v%s (hotfix)"
-git push origin main
-
-# 4. publish
-gh workflow run publish.yml -f dry_run=false
-```
-
----
-
-## 🎯 ブランチ運用
-
-| 接頭辞 | 用途 | リリースに含める? |
-|---|---|---|
-| `feat/...` | 機能追加 | minor bump |
-| `fix/...` | バグ修正 | patch bump |
-| `refactor/...` | 内部整理 | minor or patch |
-| `docs/...` | ドキュメント | patch (またはスキップ) |
-| `chore/...` | 雑務（依存更新等） | リリース対象外（マージはする） |
-
----
-
-## 🔒 publish 権限
-
-publish 操作は **NPM_TOKEN を持つ GitHub Actions のみ** が実行可能。
-ローカルから `npm publish` を直接叩く運用は禁止。
-
-token 管理:
-- npmjs.com で Access Token を発行
-- リポジトリの Settings > Secrets and variables > Actions > `NPM_TOKEN`
-- token は **少なくとも 1 年に 1 度** rotate
-
----
-
-## 📋 リリース前チェックリスト
-
-```
-[ ] main 最新を pull
-[ ] 全 CI 通過確認
-[ ] npm run check で品質ゲート OK
-[ ] CHANGELOG.md 更新
-[ ] package.json version bump
-[ ] dry_run で事前検証
-[ ] publish 実行
-[ ] npm view で反映確認
-[ ] cake-api/frontend で動作確認
-[ ] Slack #design-system チャンネルに告知
-```
-
----
-
-## ⚠️ よくある失敗パターン
-
-| 失敗 | 原因 | 対策 |
-|---|---|---|
-| publish が走らない | NPM_TOKEN 未設定 / 期限切れ | secrets を再登録 |
-| `npm version` が main 以外で走る | 別ブランチで実行 | main で実行する |
-| dist が古い | build:lib スキップ | workflow が自動で実行するので問題なし |
-| 同じバージョンを 2 回 publish | npm が拒否 | バージョンを bump し直す（1 度発行された version は永久に上書き不可） |
-| `prepack` で本番ビルド失敗 | peer dep 不足 | npm ci で全部入る、ローカルで再現できないなら CI ログを確認 |
-
----
-
-## 🔗 関連ドキュメント
-
-- [CHANGELOG.md](./CHANGELOG.md) — 過去のリリース履歴
-- [MIGRATION.md](./MIGRATION.md) — バージョン間の移行ガイド
-- [.github/workflows/publish.yml](./.github/workflows/publish.yml) — publish workflow 定義