ksk-design-system 1.53.0 → 1.55.0

package/contracts/components.json

@@ -1,7 +1,7 @@
 {
   "meta": {
     "name": "KSK Design System — Component Contracts",
-    "version": "1.53.0",
+    "version": "1.55.0",
     "description": "全コンポーネントの構造化定義。バリアント・アクセシビリティ要件・使用ルールを機械可読形式で管理。",
     "counts": {
       "ui": 67,

package/contracts/token-hex-cache.json

@@ -1,7 +1,7 @@
 {
   "meta": {
     "name": "KSK Design System — Semantic Token Hex Cache",
-    "version": "1.53.0",
+    "version": "1.55.0",
     "description": "semantic / semanticDark トークン（var(--Primitive-*) 参照）を実 hex に解決したサイドカー生成物。hex はデフォルト（Blue）テーマでの解決値であり、Brand 系（meta.themeDependentKeys に列挙）はテーマ差し替え（orange/green/violet 等）で実色が変わる。テーマ別の完全解決値は `ksk-design-system/native` エクスポート（バンドル済み native トークンモジュール）の themes を参照。tokens.json 本体のスキーマは変更せず、AI がこのファイルだけで実色を把握できるようにし、primitive 値の変更による semantic 実色のドリフトを --check で機械検出する。",
     "generatedBy": "scripts/generate-token-hex-cache.mjs",
     "theme": "default",

package/dist/native/ui.js

@@ -436,39 +436,52 @@ function Oe({ padding: e = 4, elevation: t, style: n, children: r, ...i }) {
 }
 //#endregion
 //#region src/native/components/CardHeader.tsx
-function ke({ eyebrow: e, title: t, titleVariant: n = "heading.xl", description: r, trailing: i, style: a, ...o }) {
-	let { theme: s, scales: c } = K();
+function ke({ eyebrow: e, title: t, titleVariant: n = "heading.xl", titleLeading: r, description: i, trailing: a, tone: o = "default", style: s, ...c }) {
+	let { theme: l, scales: u } = K(), d = o === "on-primary" ? l.text["on-media"] : l.text["accent-primary"], f = o === "on-primary" ? l.text["on-media"] : l.text["high-emphasis"], p = o === "on-primary" ? l.text["on-media-secondary"] : l.text["medium-emphasis"];
 	return /* @__PURE__ */ D(W, {
 		style: [{
 			flexDirection: "row",
 			alignItems: "flex-start",
 			justifyContent: "space-between",
-			gap: c.spacing.scale[2]
-		}, a],
-		...o,
+			gap: u.spacing.scale[2]
+		}, s],
+		...c,
 		children: [/* @__PURE__ */ D(W, {
 			style: { flex: 1 },
 			children: [
 				e && /* @__PURE__ */ E(H, {
 					style: [q("label.sm"), {
-						color: s.text["accent-primary"],
-						marginBottom: c.spacing.scale[1]
+						color: d,
+						marginBottom: u.spacing.scale[1]
 					}],
 					children: e
 				}),
-				/* @__PURE__ */ E(H, {
-					style: [q(n), { color: s.text["high-emphasis"] }],
+				r ? /* @__PURE__ */ D(W, {
+					style: {
+						flexDirection: "row",
+						alignItems: "center",
+						gap: u.spacing.scale[1]
+					},
+					children: [r, /* @__PURE__ */ E(H, {
+						style: [q(n), {
+							color: f,
+							flexShrink: 1
+						}],
+						children: t
+					})]
+				}) : /* @__PURE__ */ E(H, {
+					style: [q(n), { color: f }],
 					children: t
 				}),
-				r && /* @__PURE__ */ E(H, {
+				i && /* @__PURE__ */ E(H, {
 					style: [q("body.md"), {
-						color: s.text["medium-emphasis"],
-						marginTop: c.spacing.scale[1]
+						color: p,
+						marginTop: u.spacing.scale[1]
 					}],
-					children: r
+					children: i
 				})
 			]
-		}), i]
+		}), a]
 	});
 }
 //#endregion

package/dist/types/native/components/CardHeader.d.ts

@@ -6,8 +6,15 @@ export interface CardHeaderProps extends ViewProps {
     title: string;
     /** 既定 heading.xl */
     titleVariant?: TypoVariant;
+    /**
+     * 見出し先頭に添える装飾アイコン等。タップ可能要素は置かない
+     * （押下は Card/親側の責務。ここは視覚的な装飾専用スロット）。
+     */
+    titleLeading?: React.ReactNode;
     description?: string;
     trailing?: React.ReactNode;
+    /** 画像/グラデーション等の media 上に載せる場合は "on-primary"。既定 "default" */
+    tone?: "default" | "on-primary";
 }
 /** カード冒頭の eyebrow+見出し+説明。余白（4px/4px）を内蔵し利用側の mt-* 手書きを不要にする。 */
-export declare function CardHeader({ eyebrow, title, titleVariant, description, trailing, style, ...rest }: CardHeaderProps): React.JSX.Element;
+export declare function CardHeader({ eyebrow, title, titleVariant, titleLeading, description, trailing, tone, style, ...rest }: CardHeaderProps): React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ksk-design-system",
-  "version": "1.53.0",
+  "version": "1.55.0",
   "type": "module",
   "description": "KSK Design System — フリーランス向けマルチテーマ対応デザインシステム",
   "license": "MIT",