melta-app 0.8.0 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +18 -1
- package/lib/module/a11y/tap-target.js +3 -9
- package/lib/module/a11y/tap-target.js.map +1 -1
- package/lib/module/components/Header.js +28 -16
- package/lib/module/components/Header.js.map +1 -1
- package/lib/module/components/TextField.js +5 -2
- package/lib/module/components/TextField.js.map +1 -1
- package/lib/module/components/Toast.js +8 -1
- package/lib/module/components/Toast.js.map +1 -1
- package/lib/module/components/header.styles.js +26 -18
- package/lib/module/components/header.styles.js.map +1 -1
- package/lib/module/components/textfield.styles.js +22 -0
- package/lib/module/components/textfield.styles.js.map +1 -1
- package/lib/module/components/toast.styles.js +6 -2
- package/lib/module/components/toast.styles.js.map +1 -1
- package/lib/module/contracts/contract-types.js +2 -2
- package/lib/module/contracts/contract-types.js.map +1 -1
- package/lib/typescript/src/a11y/tap-target.d.ts +0 -7
- package/lib/typescript/src/a11y/tap-target.d.ts.map +1 -1
- package/lib/typescript/src/components/Header.d.ts +10 -14
- package/lib/typescript/src/components/Header.d.ts.map +1 -1
- package/lib/typescript/src/components/TextField.d.ts.map +1 -1
- package/lib/typescript/src/components/Toast.d.ts.map +1 -1
- package/lib/typescript/src/components/header.styles.d.ts +22 -13
- package/lib/typescript/src/components/header.styles.d.ts.map +1 -1
- package/lib/typescript/src/components/textfield.styles.d.ts +12 -0
- package/lib/typescript/src/components/textfield.styles.d.ts.map +1 -1
- package/lib/typescript/src/components/toast.styles.d.ts +5 -1
- package/lib/typescript/src/components/toast.styles.d.ts.map +1 -1
- package/lib/typescript/src/contracts/contract-types.d.ts +2 -2
- package/llms.txt +1 -1
- package/package.json +4 -3
- package/src/a11y/tap-target.ts +3 -9
- package/src/components/Header.tsx +25 -24
- package/src/components/TextField.tsx +3 -0
- package/src/components/Toast.tsx +11 -1
- package/src/components/header.styles.ts +29 -28
- package/src/components/textfield.styles.ts +21 -0
- package/src/components/toast.styles.ts +5 -1
- package/src/contracts/contract-types.ts +2 -2
package/README.md
CHANGED
|
@@ -367,7 +367,9 @@ const listRef = useRef<ScrollView>(null);
|
|
|
367
367
|
| `Toggle` medium / large | track 24 / 28 | 縦 hitSlop 10 / 8 | 44 |
|
|
368
368
|
| `Checkbox` の行 | box 20(行は label 込み) | `minHeight: 44` | 44 |
|
|
369
369
|
|
|
370
|
-
- **背景を持つ要素は hitSlop
|
|
370
|
+
- **背景を持つ要素は hitSlop、持たない行は `minHeight`**。背景がある要素を minHeight で伸ばすと見た目が変わるため。
|
|
371
|
+
例外は × / action のような**小型の固定標的**で、見えない箱(minWidth/minHeight)+ hitSlop の複合
|
|
372
|
+
(正典パターン 24+10、Toast のように横 hitSlop を絞る席では箱を 32 に広げて 44 を維持)
|
|
371
373
|
- **横方向の hitSlop は隣接する操作要素との gap の 1/2 まで**。超えると当たり判定が重なって押し違いが起きる
|
|
372
374
|
(`Toast` の action と × はこれで実際に 8pt 重なっていた。0.7.0 で修正)
|
|
373
375
|
- ⚠️ **iconOnly の `Button` だけは横にも hitSlop が付く**(幅 32/40 では 44pt に届かないため)。
|
|
@@ -666,3 +668,18 @@ telemetry / 使用状況の収集は無い。runtime 依存ゼロ(peerDependen
|
|
|
666
668
|
## License
|
|
667
669
|
|
|
668
670
|
MIT([LICENSE](./LICENSE))。同梱するアイコングリフの帰属表示は [THIRD_PARTY_LICENSES.md](./THIRD_PARTY_LICENSES.md)。
|
|
671
|
+
|
|
672
|
+
|
|
673
|
+
### 操作バーとしてのHeader
|
|
674
|
+
|
|
675
|
+
`<Header variant="actions" title="作業ログを残す" leading={closeButton} trailing={actions} />` は、
|
|
676
|
+
タイトルを画面では隠し、読み上げ可能な見出しとして残します。`title`には空でない画面名を渡します。
|
|
677
|
+
左右の操作は既存のslotで渡し、操作間のgapと各ボタンの有効領域はslot内で確保してください。
|
|
678
|
+
Headerの上下余白と下線は標準recipeが持つため、アプリ側で複製しません。
|
|
679
|
+
中央spacer前後のgapはactionsではspacing.1、defaultでは従来のspacing.3です。
|
|
680
|
+
variant省略時は従来どおり可視タイトルを表示します。
|
|
681
|
+
|
|
682
|
+
カタログをWeb exportしてローカル配信した後、`npm run check:header-layout -- --base <URL>` で
|
|
683
|
+
320/393px幅・大きな子要素の余白と44pt標的を測定できます。Playwrightは検証環境に用意し、
|
|
684
|
+
別のインストールを使う場合は `--playwright-module <playwrightのディレクトリ>` を渡します。
|
|
685
|
+
この実描画検査は手動レーンで、OSの文字拡大・読み上げ確認は別途必要です。
|
|
@@ -29,13 +29,7 @@ export const CANONICAL_TAP_TARGET = {
|
|
|
29
29
|
hitSlop: 10
|
|
30
30
|
};
|
|
31
31
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
* ⚠️ 実装の hitSlop 値をこの関数で計算しないこと(上のコメント参照)。
|
|
36
|
-
* 使うのは (a) 値を決めるときの検算、(b) conformance テストの期待値算出。
|
|
37
|
-
*/
|
|
38
|
-
export function requiredHitSlop(visual) {
|
|
39
|
-
return Math.max(0, Math.ceil((MIN_TAP_TARGET - visual) / 2));
|
|
40
|
-
}
|
|
32
|
+
// requiredHitSlop(必要 hitSlop の導出関数)は置かない — 実装値は literal 規約で導出禁止、
|
|
33
|
+
// テスト側も「実効 = 視覚 + slop×2 >= 44」を直接検算するため使い道が無い(dead code 化して撤去、
|
|
34
|
+
// Codex スパン監査 2026-08-06)。値を決めるときの検算は手計算 ceil((44 − 視覚) / 2) で足りる。
|
|
41
35
|
//# sourceMappingURL=tap-target.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["MIN_TAP_TARGET","CANONICAL_TAP_TARGET","minWidth","minHeight","hitSlop"
|
|
1
|
+
{"version":3,"names":["MIN_TAP_TARGET","CANONICAL_TAP_TARGET","minWidth","minHeight","hitSlop"],"sourceRoot":"../../../src","sources":["a11y/tap-target.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,OAAO,MAAMA,cAAc,GAAG,EAAE;;AAEhC;AACA;AACA;AACA;AACA,OAAO,MAAMC,oBAAoB,GAAG;EAClCC,QAAQ,EAAE,EAAE;EACZC,SAAS,EAAE,EAAE;EACbC,OAAO,EAAE;AACX,CAAU;;AAEV;AACA;AACA","ignoreList":[]}
|
|
@@ -1,25 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
|
-
* Header —
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
* - title は melta の Text(xl / bold / text-heading / heading role)で描画し、
|
|
9
|
-
* heading として読み上げられる(contract a11y required)。
|
|
10
|
-
* - titleWrapStyle の flex:1 で title が余白を占有し trailing を右端へ押す。
|
|
11
|
-
* - 決定ロジックは pure resolver(header.styles.ts)に分離 — recipe との機械照合対象。
|
|
4
|
+
* Header — 画面名と左右の操作を持つ共通ヘッダー。
|
|
5
|
+
* actionsでは画面名を視覚的に隠すが、独立したa11y見出しとして残す。
|
|
6
|
+
* 余白・下線・見出しの配置はheader recipeとpure resolverが所有する。
|
|
12
7
|
*/
|
|
13
|
-
|
|
14
8
|
import { useMemo } from "react";
|
|
15
9
|
import { View } from "react-native";
|
|
16
10
|
import { useTheme } from "../theme/index.js";
|
|
17
11
|
import { CONTRACTS } from "../contracts/contract-types.js";
|
|
18
12
|
import { Text } from "../primitives/Text.js";
|
|
19
|
-
import { resolveHeaderStyle } from "./header.styles.js";
|
|
13
|
+
import { HEADER_SPEC, resolveHeaderStyle } from "./header.styles.js";
|
|
20
14
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
21
15
|
export function Header({
|
|
22
16
|
title,
|
|
17
|
+
variant = "default",
|
|
23
18
|
leading,
|
|
24
19
|
trailing,
|
|
25
20
|
style,
|
|
@@ -31,17 +26,34 @@ export function Header({
|
|
|
31
26
|
} = useTheme();
|
|
32
27
|
const {
|
|
33
28
|
containerStyle,
|
|
34
|
-
titleWrapStyle
|
|
35
|
-
|
|
29
|
+
titleWrapStyle,
|
|
30
|
+
hiddenTitleStyle
|
|
31
|
+
} = useMemo(() => resolveHeaderStyle(theme, mode, {
|
|
32
|
+
variant
|
|
33
|
+
}), [theme, mode, variant]);
|
|
36
34
|
return /*#__PURE__*/_jsxs(View, {
|
|
37
35
|
style: [containerStyle, style],
|
|
38
36
|
testID: testID,
|
|
39
37
|
children: [leading, /*#__PURE__*/_jsx(View, {
|
|
40
38
|
style: titleWrapStyle,
|
|
41
|
-
children:
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
39
|
+
children: variant === "actions" ?
|
|
40
|
+
/*#__PURE__*/
|
|
41
|
+
// 見出しTextの契約を再利用し、左右の操作を親の読み上げへ畳まない。
|
|
42
|
+
_jsx(View, {
|
|
43
|
+
pointerEvents: "none",
|
|
44
|
+
style: hiddenTitleStyle,
|
|
45
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
46
|
+
variant: HEADER_SPEC.titleFont,
|
|
47
|
+
weight: HEADER_SPEC.titleWeight,
|
|
48
|
+
color: HEADER_SPEC.titleColor,
|
|
49
|
+
role: "heading",
|
|
50
|
+
numberOfLines: 1,
|
|
51
|
+
children: title
|
|
52
|
+
})
|
|
53
|
+
}) : /*#__PURE__*/_jsx(Text, {
|
|
54
|
+
variant: HEADER_SPEC.titleFont,
|
|
55
|
+
weight: HEADER_SPEC.titleWeight,
|
|
56
|
+
color: HEADER_SPEC.titleColor,
|
|
45
57
|
role: "heading",
|
|
46
58
|
numberOfLines: 1,
|
|
47
59
|
children: title
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","View","useTheme","CONTRACTS","Text","resolveHeaderStyle","jsx","_jsx","jsxs","_jsxs","Header","title","leading","trailing","style","testID","theme","mode","containerStyle","titleWrapStyle","children","
|
|
1
|
+
{"version":3,"names":["useMemo","View","useTheme","CONTRACTS","Text","HEADER_SPEC","resolveHeaderStyle","jsx","_jsx","jsxs","_jsxs","Header","title","variant","leading","trailing","style","testID","theme","mode","containerStyle","titleWrapStyle","hiddenTitleStyle","children","pointerEvents","titleFont","weight","titleWeight","color","titleColor","role","numberOfLines","__contract","header"],"sourceRoot":"../../../src","sources":["components/Header.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA,SAASA,OAAO,QAAwB,OAAO;AAC/C,SAASC,IAAI,QAAwC,cAAc;AACnE,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,SAAS,QAAwB,gCAAgC;AAC1E,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,SAASC,WAAW,EAAEC,kBAAkB,QAAQ,oBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAarE,OAAO,SAASC,MAAMA,CAAC;EAAEC,KAAK;EAAEC,OAAO,GAAG,SAAS;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,KAAK;EAAEC;AAAoB,CAAC,EAAE;EACpG,MAAM;IAAEC,KAAK;IAAEC;EAAK,CAAC,GAAGjB,QAAQ,CAAC,CAAC;EAClC,MAAM;IAAEkB,cAAc;IAAEC,cAAc;IAAEC;EAAiB,CAAC,GAAGtB,OAAO,CAClE,MAAMM,kBAAkB,CAACY,KAAK,EAAEC,IAAI,EAAE;IAAEN;EAAQ,CAAC,CAAC,EAAE,CAACK,KAAK,EAAEC,IAAI,EAAEN,OAAO,CAC3E,CAAC;EACD,oBACEH,KAAA,CAACT,IAAI;IAACe,KAAK,EAAE,CAACI,cAAc,EAAEJ,KAAK,CAAE;IAACC,MAAM,EAAEA,MAAO;IAAAM,QAAA,GAClDT,OAAO,eACRN,IAAA,CAACP,IAAI;MAACe,KAAK,EAAEK,cAAe;MAAAE,QAAA,EACzBV,OAAO,KAAK,SAAS;MAAA;MACpB;MACAL,IAAA,CAACP,IAAI;QAACuB,aAAa,EAAC,MAAM;QAACR,KAAK,EAAEM,gBAAiB;QAAAC,QAAA,eACjDf,IAAA,CAACJ,IAAI;UAACS,OAAO,EAAER,WAAW,CAACoB,SAAU;UAACC,MAAM,EAAErB,WAAW,CAACsB,WAAY;UACpEC,KAAK,EAAEvB,WAAW,CAACwB,UAAW;UAACC,IAAI,EAAC,SAAS;UAACC,aAAa,EAAE,CAAE;UAAAR,QAAA,EAC9DX;QAAK,CACF;MAAC,CACH,CAAC,gBAEPJ,IAAA,CAACJ,IAAI;QAACS,OAAO,EAAER,WAAW,CAACoB,SAAU;QAACC,MAAM,EAAErB,WAAW,CAACsB,WAAY;QACpEC,KAAK,EAAEvB,WAAW,CAACwB,UAAW;QAACC,IAAI,EAAC,SAAS;QAACC,aAAa,EAAE,CAAE;QAAAR,QAAA,EAC9DX;MAAK,CACF;IACP,CACG,CAAC,EACNG,QAAQ;EAAA,CACL,CAAC;AAEX;AACAJ,MAAM,CAACqB,UAAU,GAAG7B,SAAS,CAAC8B,MAAM","ignoreList":[]}
|
|
@@ -26,7 +26,7 @@ import { useMemo, useState } from "react";
|
|
|
26
26
|
import { Platform, TextInput, View, Text as RNText } from "react-native";
|
|
27
27
|
import { useTheme } from "../theme/index.js";
|
|
28
28
|
import { CONTRACTS } from "../contracts/contract-types.js";
|
|
29
|
-
import { resolveTextFieldStyle, resolveTextFieldFocusStyle } from "./textfield.styles.js";
|
|
29
|
+
import { resolveTextFieldHitSlop, resolveTextFieldStyle, resolveTextFieldFocusStyle } from "./textfield.styles.js";
|
|
30
30
|
|
|
31
31
|
/**
|
|
32
32
|
* Android の EditText は高さ下限(minHeight)と組み合わさると既定の縦 padding で文字が
|
|
@@ -107,7 +107,10 @@ export function TextField({
|
|
|
107
107
|
children: [/*#__PURE__*/_jsx(RNText, {
|
|
108
108
|
style: resolved.label,
|
|
109
109
|
children: label
|
|
110
|
-
}), /*#__PURE__*/_jsx(TextInput
|
|
110
|
+
}), /*#__PURE__*/_jsx(TextInput
|
|
111
|
+
// small 36 / medium 42 の視覚寸法のまま実効タップ標的 44 を満たす(規約 10、値は literal)
|
|
112
|
+
, {
|
|
113
|
+
hitSlop: resolveTextFieldHitSlop(size),
|
|
111
114
|
value: value,
|
|
112
115
|
onChangeText: onChangeText,
|
|
113
116
|
placeholder: placeholder,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","useState","Platform","TextInput","View","Text","RNText","useTheme","CONTRACTS","resolveTextFieldStyle","resolveTextFieldFocusStyle","jsx","_jsx","jsxs","_jsxs","resolveInputVerticalFix","os","paddingVertical","paddingBottom","textAlignVertical","INPUT_VERTICAL_FIX","OS","defaultErrorAccessibilityLabel","label","errorText","TextField","value","onChangeText","placeholder","variant","disabled","size","helperText","formatErrorAccessibilityLabel","keyboardType","autoCapitalize","autoCorrect","maxLength","returnKeyType","onSubmitEditing","onBlur","onFocus","style","testID","theme","mode","colors","focused","setFocused","effectiveVariant","resolved","focusStyle","showError","children","placeholderTextColor","editable","accessibilityLabel","accessibilityState","e","input","accessibilityLiveRegion","__contract","textfield"],"sourceRoot":"../../../src","sources":["components/TextField.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACzC,SACEC,QAAQ,EACRC,SAAS,EACTC,IAAI,EACJC,IAAI,IAAIC,MAAM,QAOT,cAAc;AACrB,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,SAAS,QAAQ,gCAAgC;AAC1D,SACEC,qBAAqB,EACrBC,0BAA0B,QAErB,uBAAuB;;AAE9B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AACA,OAAO,SAASC,uBAAuBA,CAACC,EAAsB,EAAa;EACzE,OAAO;IACLC,eAAe,EAAE,CAAC;IAClB,IAAID,EAAE,KAAK,SAAS,GAAG;MAAEE,aAAa,EAAE;IAAE,CAAC,GAAG,IAAI,CAAC;IACnDC,iBAAiB,EAAE;EACrB,CAAC;AACH;AACA;;AAEA,MAAMC,kBAAkB,GAAGL,uBAAuB,
|
|
1
|
+
{"version":3,"names":["useMemo","useState","Platform","TextInput","View","Text","RNText","useTheme","CONTRACTS","resolveTextFieldHitSlop","resolveTextFieldStyle","resolveTextFieldFocusStyle","jsx","_jsx","jsxs","_jsxs","resolveInputVerticalFix","os","paddingVertical","paddingBottom","textAlignVertical","INPUT_VERTICAL_FIX","OS","defaultErrorAccessibilityLabel","label","errorText","TextField","value","onChangeText","placeholder","variant","disabled","size","helperText","formatErrorAccessibilityLabel","keyboardType","autoCapitalize","autoCorrect","maxLength","returnKeyType","onSubmitEditing","onBlur","onFocus","style","testID","theme","mode","colors","focused","setFocused","effectiveVariant","resolved","focusStyle","showError","children","hitSlop","placeholderTextColor","editable","accessibilityLabel","accessibilityState","e","input","accessibilityLiveRegion","__contract","textfield"],"sourceRoot":"../../../src","sources":["components/TextField.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -75,7 +75,14 @@ export function Toast({
|
|
|
75
75
|
_jsx(Pressable, {
|
|
76
76
|
onPress: onAction,
|
|
77
77
|
accessibilityRole: "button",
|
|
78
|
-
hitSlop: TOAST_TAP_TARGET.hitSlop
|
|
78
|
+
hitSlop: TOAST_TAP_TARGET.hitSlop
|
|
79
|
+
// 短いラベル("OK" 等)でも横の実効 44 を割らないよう × と同じ幅下限(背景なし = 見た目不変)
|
|
80
|
+
,
|
|
81
|
+
style: {
|
|
82
|
+
minWidth: TOAST_TAP_TARGET.actionMinWidth,
|
|
83
|
+
alignItems: "center",
|
|
84
|
+
justifyContent: "center"
|
|
85
|
+
},
|
|
79
86
|
children: /*#__PURE__*/_jsx(Text, {
|
|
80
87
|
variant: TOAST_SPEC.messageFont,
|
|
81
88
|
weight: TOAST_SPEC.messageWeight,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","Pressable","View","Text","useTheme","CONTRACTS","TOAST_SPEC","TOAST_TAP_TARGET","resolveToastStyles","jsx","_jsx","jsxs","_jsxs","Toast","variant","message","description","onClose","actionLabel","onAction","closeAccessibilityLabel","style","testID","theme","mode","styles","accessibilityLiveRegion","containerStyle","elevation","children","flex","gap","spacing","messageFont","weight","messageWeight","color","messageStyle","onPress","accessibilityRole","hitSlop","
|
|
1
|
+
{"version":3,"names":["useMemo","Pressable","View","Text","useTheme","CONTRACTS","TOAST_SPEC","TOAST_TAP_TARGET","resolveToastStyles","jsx","_jsx","jsxs","_jsxs","Toast","variant","message","description","onClose","actionLabel","onAction","closeAccessibilityLabel","style","testID","theme","mode","styles","accessibilityLiveRegion","containerStyle","elevation","children","flex","gap","spacing","messageFont","weight","messageWeight","color","messageStyle","onPress","accessibilityRole","hitSlop","minWidth","actionMinWidth","alignItems","justifyContent","textDecorationLine","accessibilityLabel","closeMinWidth","minHeight","closeMinHeight","__contract","toast"],"sourceRoot":"../../../src","sources":["components/Toast.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,33 +1,41 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
/**
|
|
4
|
-
* header.styles — Header の pure style resolver(styleRefs conformance 対応で Header.tsx から分離)。
|
|
5
|
-
*
|
|
6
|
-
* react-native を import しない純粋モジュールにすることで node テスト(tsx --test)から
|
|
7
|
-
* 直接実行できる。recipes/app/header.recipe.json(melta-contracts の styleRefs)との
|
|
8
|
-
* 機械照合は scripts/lib/header-conformance.test.ts が行う。
|
|
9
|
-
*/
|
|
3
|
+
/** Headerの見た目をrecipeと照合できるpure resolverへ集約する。 */
|
|
10
4
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
5
|
+
export const HEADER_SPEC = {
|
|
6
|
+
gap: "3",
|
|
7
|
+
actionsGap: "1",
|
|
8
|
+
paddingX: "4",
|
|
9
|
+
paddingY: "3",
|
|
10
|
+
titleFont: "xl",
|
|
11
|
+
titleWeight: "bold",
|
|
12
|
+
titleColor: "text-heading",
|
|
13
|
+
borderWidth: 1,
|
|
14
|
+
hiddenTitleSize: 1
|
|
15
|
+
};
|
|
16
|
+
export function resolveHeaderStyle(theme, mode, props = {}) {
|
|
17
17
|
return {
|
|
18
18
|
containerStyle: {
|
|
19
19
|
flexDirection: "row",
|
|
20
20
|
alignItems: "center",
|
|
21
|
-
gap: theme.spacing["
|
|
22
|
-
paddingHorizontal: theme.spacing[
|
|
23
|
-
paddingVertical: theme.spacing[
|
|
21
|
+
gap: theme.spacing[props.variant === "actions" ? HEADER_SPEC.actionsGap : HEADER_SPEC.gap],
|
|
22
|
+
paddingHorizontal: theme.spacing[HEADER_SPEC.paddingX],
|
|
23
|
+
paddingVertical: theme.spacing[HEADER_SPEC.paddingY],
|
|
24
24
|
backgroundColor: theme.color.semantic[mode]["bg-page"],
|
|
25
|
-
borderBottomWidth:
|
|
25
|
+
borderBottomWidth: HEADER_SPEC.borderWidth,
|
|
26
26
|
borderBottomColor: theme.color.semantic[mode]["border-default"]
|
|
27
27
|
},
|
|
28
28
|
titleWrapStyle: {
|
|
29
29
|
flex: 1
|
|
30
|
-
}
|
|
30
|
+
},
|
|
31
|
+
...(props.variant === "actions" ? {
|
|
32
|
+
hiddenTitleStyle: {
|
|
33
|
+
position: "absolute",
|
|
34
|
+
width: HEADER_SPEC.hiddenTitleSize,
|
|
35
|
+
height: HEADER_SPEC.hiddenTitleSize,
|
|
36
|
+
overflow: "hidden"
|
|
37
|
+
}
|
|
38
|
+
} : {})
|
|
31
39
|
};
|
|
32
40
|
}
|
|
33
41
|
//# sourceMappingURL=header.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["resolveHeaderStyle","theme","mode","containerStyle","flexDirection","alignItems","
|
|
1
|
+
{"version":3,"names":["HEADER_SPEC","gap","actionsGap","paddingX","paddingY","titleFont","titleWeight","titleColor","borderWidth","hiddenTitleSize","resolveHeaderStyle","theme","mode","props","containerStyle","flexDirection","alignItems","spacing","variant","paddingHorizontal","paddingVertical","backgroundColor","color","semantic","borderBottomWidth","borderBottomColor","titleWrapStyle","flex","hiddenTitleStyle","position","width","height","overflow"],"sourceRoot":"../../../src","sources":["components/header.styles.ts"],"mappings":";;AAAA;;AAIA,OAAO,MAAMA,WAAW,GAAG;EACzBC,GAAG,EAAE,GAAG;EAAEC,UAAU,EAAE,GAAG;EAAEC,QAAQ,EAAE,GAAG;EAAEC,QAAQ,EAAE,GAAG;EACvDC,SAAS,EAAE,IAAI;EAAEC,WAAW,EAAE,MAAM;EAAEC,UAAU,EAAE,cAAc;EAChEC,WAAW,EAAE,CAAC;EAAEC,eAAe,EAAE;AACnC,CAIC;AAYD,OAAO,SAASC,kBAAkBA,CAChCC,KAAkB,EAAEC,IAAe,EAAEC,KAAwC,GAAG,CAAC,CAAC,EACrE;EACb,OAAO;IACLC,cAAc,EAAE;MACdC,aAAa,EAAE,KAAK;MAAEC,UAAU,EAAE,QAAQ;MAAEf,GAAG,EAAEU,KAAK,CAACM,OAAO,CAACJ,KAAK,CAACK,OAAO,KAAK,SAAS,GAAGlB,WAAW,CAACE,UAAU,GAAGF,WAAW,CAACC,GAAG,CAAC;MACtIkB,iBAAiB,EAAER,KAAK,CAACM,OAAO,CAACjB,WAAW,CAACG,QAAQ,CAAC;MACtDiB,eAAe,EAAET,KAAK,CAACM,OAAO,CAACjB,WAAW,CAACI,QAAQ,CAAC;MACpDiB,eAAe,EAAEV,KAAK,CAACW,KAAK,CAACC,QAAQ,CAACX,IAAI,CAAC,CAAC,SAAS,CAAC;MACtDY,iBAAiB,EAAExB,WAAW,CAACQ,WAAW;MAC1CiB,iBAAiB,EAAEd,KAAK,CAACW,KAAK,CAACC,QAAQ,CAACX,IAAI,CAAC,CAAC,gBAAgB;IAChE,CAAC;IACDc,cAAc,EAAE;MAAEC,IAAI,EAAE;IAAE,CAAC;IAC3B,IAAId,KAAK,CAACK,OAAO,KAAK,SAAS,GAAG;MAChCU,gBAAgB,EAAE;QAChBC,QAAQ,EAAE,UAAmB;QAAEC,KAAK,EAAE9B,WAAW,CAACS,eAAe;QACjEsB,MAAM,EAAE/B,WAAW,CAACS,eAAe;QAAEuB,QAAQ,EAAE;MACjD;IACF,CAAC,GAAG,CAAC,CAAC;EACR,CAAC;AACH","ignoreList":[]}
|
|
@@ -46,6 +46,28 @@ export const TEXTFIELD_SIZE_SPEC = {
|
|
|
46
46
|
}
|
|
47
47
|
};
|
|
48
48
|
|
|
49
|
+
/**
|
|
50
|
+
* TextInput への縦 hitSlop(片側)。small 36 / medium 42 は視覚寸法(recipe の minHeight)を
|
|
51
|
+
* 変えずに実効タップ標的 44 を満たすための手当て(A11Y_MIN_TAP_TARGET_44・規約 10。
|
|
52
|
+
* Codex スパン監査 2026-08-06: TextField が 44pt 横断の対象から漏れていた)。
|
|
53
|
+
* 横は付けない(input は親幅いっぱいで既に広い)。値は literal(規約 10: 導出しない)。
|
|
54
|
+
*/
|
|
55
|
+
export const TEXTFIELD_VERTICAL_HIT_SLOP = {
|
|
56
|
+
small: 4,
|
|
57
|
+
medium: 1,
|
|
58
|
+
large: 0
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
/** size → TextInput に渡す hitSlop。0 のときは undefined(prop を付けない)。 */
|
|
62
|
+
export function resolveTextFieldHitSlop(size) {
|
|
63
|
+
const slop = TEXTFIELD_VERTICAL_HIT_SLOP[size];
|
|
64
|
+
if (slop === 0) return undefined;
|
|
65
|
+
return {
|
|
66
|
+
top: slop,
|
|
67
|
+
bottom: slop
|
|
68
|
+
};
|
|
69
|
+
}
|
|
70
|
+
|
|
49
71
|
/** resolver の出力(label → input → helperText / errorText の縦構成の各パート)。 */
|
|
50
72
|
|
|
51
73
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["resolveStatusTokenColors","TEXTFIELD_SIZE_SPEC","small","minHeight","px","font","medium","large","resolveTextFieldStyle","theme","mode","variant","
|
|
1
|
+
{"version":3,"names":["resolveStatusTokenColors","TEXTFIELD_SIZE_SPEC","small","minHeight","px","font","medium","large","TEXTFIELD_VERTICAL_HIT_SLOP","resolveTextFieldHitSlop","size","slop","undefined","top","bottom","resolveTextFieldStyle","theme","mode","variant","c","color","sem","semantic","spec","danger","colors","borderColor","backgroundColor","status","base","bg","success","input","paddingHorizontal","spacing","fontSize","typography","borderWidth","borderRadius","radius","md","label","sm","fontWeight","marginBottom","helperText","xs","marginTop","errorText","text","resolveTextFieldFocusStyle","primary"],"sourceRoot":"../../../src","sources":["components/textfield.styles.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -45,7 +45,9 @@ export const TOAST_SPEC = {
|
|
|
45
45
|
*
|
|
46
46
|
* 横を 6 に削ると × の実効幅が 24 + 6×2 = 36pt と 44pt を割るため、**箱の下限を 32pt に広げて**
|
|
47
47
|
* 32 + 6×2 = 44pt を確保する(× は背景を持たないので幅を広げても見た目は変わらない)。
|
|
48
|
-
* action
|
|
48
|
+
* action 側も同じ手当て: テキスト幅は可変だが「短いラベル("OK" 等)で 44pt を割る」のは
|
|
49
|
+
* × と同型の問題なので、見えない箱の幅下限 32 + 横 hitSlop 6×2 = 44 で静的に保証する
|
|
50
|
+
* (Codex スパン監査 2026-08-06。従来は縦のみ保証で、横は「実運用では超える」頼みだった)。
|
|
49
51
|
*/
|
|
50
52
|
export const TOAST_TAP_TARGET = {
|
|
51
53
|
/** action / × 共通の hitSlop(横だけ gap/2 = 6 に絞る)。 */
|
|
@@ -58,7 +60,9 @@ export const TOAST_TAP_TARGET = {
|
|
|
58
60
|
/** × の箱の幅の下限(横 hitSlop を削ったぶん canonical の 24 から広げる。32 + 6×2 = 44)。 */
|
|
59
61
|
closeMinWidth: 32,
|
|
60
62
|
/** × の箱の高さ下限(正典パターンと同値)。 */
|
|
61
|
-
closeMinHeight: CANONICAL_TAP_TARGET.minHeight
|
|
63
|
+
closeMinHeight: CANONICAL_TAP_TARGET.minHeight,
|
|
64
|
+
/** action の箱の幅の下限(× と同じ 32 + 6×2 = 44。背景なしなので見た目不変)。 */
|
|
65
|
+
actionMinWidth: 32
|
|
62
66
|
};
|
|
63
67
|
|
|
64
68
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["resolveStatusVariantColors","CANONICAL_TAP_TARGET","TOAST_SPEC","padding","gap","radius","elevation","messageFont","messageWeight","TOAST_TAP_TARGET","hitSlop","top","bottom","left","right","closeMinWidth","closeMinHeight","minHeight","resolveToastStyles","theme","mode","variant","bg","text","containerStyle","backgroundColor","borderRadius","spacing","flexDirection","alignItems","messageStyle","color","fontSize","typography","fontWeight"],"sourceRoot":"../../../src","sources":["components/toast.styles.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAaA,SAASA,0BAA0B,QAA4B,oBAAoB;AACnF,SAASC,oBAAoB,QAAQ,uBAAuB;;AAE5D;;AAGA;AACA;AACA;AACA;AACA,OAAO,MAAMC,UAAU,GAAG;EACxBC,OAAO,EAAE,GAAG;EACZC,GAAG,EAAE,GAAG;EACRC,MAAM,EAAE,IAAI;EACZC,SAAS,EAAE,IAAI;EACfC,WAAW,EAAE,IAAI;EACjBC,aAAa,EAAE;AACjB,CAOC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,gBAAgB,GAAG;EAC9B;EACAC,OAAO,EAAE;IAAEC,GAAG,EAAE,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,IAAI,EAAE,CAAC;IAAEC,KAAK,EAAE;EAAE,CAAC;EACnD;EACAC,aAAa,EAAE,EAAE;EACjB;EACAC,cAAc,EAAEf,oBAAoB,CAACgB;
|
|
1
|
+
{"version":3,"names":["resolveStatusVariantColors","CANONICAL_TAP_TARGET","TOAST_SPEC","padding","gap","radius","elevation","messageFont","messageWeight","TOAST_TAP_TARGET","hitSlop","top","bottom","left","right","closeMinWidth","closeMinHeight","minHeight","actionMinWidth","resolveToastStyles","theme","mode","variant","bg","text","containerStyle","backgroundColor","borderRadius","spacing","flexDirection","alignItems","messageStyle","color","fontSize","typography","fontWeight"],"sourceRoot":"../../../src","sources":["components/toast.styles.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAaA,SAASA,0BAA0B,QAA4B,oBAAoB;AACnF,SAASC,oBAAoB,QAAQ,uBAAuB;;AAE5D;;AAGA;AACA;AACA;AACA;AACA,OAAO,MAAMC,UAAU,GAAG;EACxBC,OAAO,EAAE,GAAG;EACZC,GAAG,EAAE,GAAG;EACRC,MAAM,EAAE,IAAI;EACZC,SAAS,EAAE,IAAI;EACfC,WAAW,EAAE,IAAI;EACjBC,aAAa,EAAE;AACjB,CAOC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,gBAAgB,GAAG;EAC9B;EACAC,OAAO,EAAE;IAAEC,GAAG,EAAE,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,IAAI,EAAE,CAAC;IAAEC,KAAK,EAAE;EAAE,CAAC;EACnD;EACAC,aAAa,EAAE,EAAE;EACjB;EACAC,cAAc,EAAEf,oBAAoB,CAACgB,SAAS;EAC9C;EACAC,cAAc,EAAE;AAClB,CAAU;;AAEV;AACA;AACA;AACA;;AAoBA;AACA,OAAO,SAASC,kBAAkBA,CAChCC,KAAkB,EAClBC,IAAe,EACfC,OAAqB,EACR;EACb,MAAM;IAAEC,EAAE;IAAEC;EAAK,CAAC,GAAGxB,0BAA0B,CAACoB,KAAK,EAAEC,IAAI,EAAEC,OAAO,CAAC;EACrE,OAAO;IACLG,cAAc,EAAE;MACdC,eAAe,EAAEH,EAAE;MACnBI,YAAY,EAAEP,KAAK,CAACf,MAAM,CAACH,UAAU,CAACG,MAAM,CAAC;MAC7CF,OAAO,EAAEiB,KAAK,CAACQ,OAAO,CAAC1B,UAAU,CAACC,OAAO,CAAC;MAC1C0B,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpB1B,GAAG,EAAEgB,KAAK,CAACQ,OAAO,CAAC1B,UAAU,CAACE,GAAG;IACnC,CAAC;IACDE,SAAS,EAAEc,KAAK,CAACd,SAAS,CAACJ,UAAU,CAACI,SAAS,CAAC;IAChDyB,YAAY,EAAE;MACZC,KAAK,EAAER,IAAI;MACXS,QAAQ,EAAEb,KAAK,CAACc,UAAU,CAACD,QAAQ,CAAC/B,UAAU,CAACK,WAAW,CAAC,CAAC0B,QAAQ;MACpEE,UAAU,EAAEf,KAAK,CAACc,UAAU,CAACC,UAAU,CAACjC,UAAU,CAACM,aAAa;IAClE;EACF,CAAC;AACH","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["CONTRACTS","text","id","version","variants","sizes","states","button","tag","card","image","surface","skeleton","emptyState","metric","stack","row","screen","header","icon","avatar","textfield","toggle","checkbox","radio","alert","toast","progress","modal","actionSheet","bottomSheet"],"sourceRoot":"../../../src","sources":["contracts/contract-types.ts"],"mappings":";;AAAA;AACA;AACA;;AAEA;;AASA,OAAO,MAAMA,SAAS,GAAG;EACvBC,IAAI,EAAE;IACJC,EAAE,EAAE,MAAM;IACVC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC;IAC/DC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDC,MAAM,EAAE;IACNL,EAAE,EAAE,QAAQ;IACZC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,WAAW,EAAE,UAAU,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC;IAC9FC,KAAK,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;IACnCC,MAAM,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS;EAC7D,CAAC;EACDE,GAAG,EAAE;IACHN,EAAE,EAAE,KAAK;IACTC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,aAAa,CAAC;IAC/CC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO;EAC5D,CAAC;EACDG,IAAI,EAAE;IACJP,EAAE,EAAE,MAAM;IACVC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,CAAC;IAC9CC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,cAAc;EAC7C,CAAC;EACDI,KAAK,EAAE;IACLR,EAAE,EAAE,OAAO;IACXC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrBC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS,EAAE,OAAO;EAC7B,CAAC;EACDK,OAAO,EAAE;IACPT,EAAE,EAAE,SAAS;IACbC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrBC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDM,QAAQ,EAAE;IACRV,EAAE,EAAE,UAAU;IACdC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC;IACpCC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ;EACzC,CAAC;EACDO,UAAU,EAAE;IACVX,EAAE,EAAE,aAAa;IACjBC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrBC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDQ,MAAM,EAAE;IACNZ,EAAE,EAAE,QAAQ;IACZC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrBC,KAAK,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;IACzBC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDS,KAAK,EAAE;IACLb,EAAE,EAAE,OAAO;IACXC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrBC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDU,GAAG,EAAE;IACHd,EAAE,EAAE,KAAK;IACTC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrBC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDW,MAAM,EAAE;IACNf,EAAE,EAAE,QAAQ;IACZC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC;IAC7BC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC,SAAS;EACpB,CAAC;EACDY,MAAM,EAAE;IACNhB,EAAE,EAAE,QAAQ;IACZC,OAAO,EAAE,OAAO;IAChBC,QAAQ,EAAE,CAAC,SAAS,CAAC;
|
|
1
|
+
{"version":3,"names":["CONTRACTS","text","id","version","variants","sizes","states","button","tag","card","image","surface","skeleton","emptyState","metric","stack","row","screen","header","icon","avatar","textfield","toggle","checkbox","radio","alert","toast","progress","modal","actionSheet","bottomSheet"],"sourceRoot":"../../../src","sources":["contracts/contract-types.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -24,11 +24,4 @@ export declare const CANONICAL_TAP_TARGET: {
|
|
|
24
24
|
readonly minHeight: 24;
|
|
25
25
|
readonly hitSlop: 10;
|
|
26
26
|
};
|
|
27
|
-
/**
|
|
28
|
-
* 視覚寸法 `visual` を実効 44pt に届かせるのに必要な**片側** hitSlop(切り上げ = 安全側)。
|
|
29
|
-
*
|
|
30
|
-
* ⚠️ 実装の hitSlop 値をこの関数で計算しないこと(上のコメント参照)。
|
|
31
|
-
* 使うのは (a) 値を決めるときの検算、(b) conformance テストの期待値算出。
|
|
32
|
-
*/
|
|
33
|
-
export declare function requiredHitSlop(visual: number): number;
|
|
34
27
|
//# sourceMappingURL=tap-target.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tap-target.d.ts","sourceRoot":"","sources":["../../../../src/a11y/tap-target.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,iEAAiE;AACjE,eAAO,MAAM,cAAc,KAAK,CAAC;AAEjC;;;GAGG;AACH,eAAO,MAAM,oBAAoB;;;;CAIvB,CAAC
|
|
1
|
+
{"version":3,"file":"tap-target.d.ts","sourceRoot":"","sources":["../../../../src/a11y/tap-target.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,iEAAiE;AACjE,eAAO,MAAM,cAAc,KAAK,CAAC;AAEjC;;;GAGG;AACH,eAAO,MAAM,oBAAoB;;;;CAIvB,CAAC"}
|
|
@@ -1,31 +1,27 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Header —
|
|
3
|
-
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
6
|
-
* - title は melta の Text(xl / bold / text-heading / heading role)で描画し、
|
|
7
|
-
* heading として読み上げられる(contract a11y required)。
|
|
8
|
-
* - titleWrapStyle の flex:1 で title が余白を占有し trailing を右端へ押す。
|
|
9
|
-
* - 決定ロジックは pure resolver(header.styles.ts)に分離 — recipe との機械照合対象。
|
|
2
|
+
* Header — 画面名と左右の操作を持つ共通ヘッダー。
|
|
3
|
+
* actionsでは画面名を視覚的に隠すが、独立したa11y見出しとして残す。
|
|
4
|
+
* 余白・下線・見出しの配置はheader recipeとpure resolverが所有する。
|
|
10
5
|
*/
|
|
11
6
|
import { type ReactNode } from "react";
|
|
12
7
|
import { type StyleProp, type ViewStyle } from "react-native";
|
|
8
|
+
import { type VariantOf } from "../contracts/contract-types.js";
|
|
13
9
|
interface HeaderProps {
|
|
14
|
-
/**
|
|
10
|
+
/** 空でない画面名。actionsでも読み上げるため必須。 */
|
|
15
11
|
title: string;
|
|
16
|
-
/**
|
|
12
|
+
/** defaultは可視見出し、actionsは可視タイトルのない操作バー。 */
|
|
13
|
+
variant?: VariantOf<"header">;
|
|
17
14
|
leading?: ReactNode;
|
|
18
|
-
/** 右端の slot(アクション等)。 */
|
|
19
15
|
trailing?: ReactNode;
|
|
20
16
|
style?: StyleProp<ViewStyle>;
|
|
21
17
|
testID?: string;
|
|
22
18
|
}
|
|
23
|
-
export declare function Header({ title, leading, trailing, style, testID }: HeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
export declare function Header({ title, variant, leading, trailing, style, testID }: HeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
24
20
|
export declare namespace Header {
|
|
25
21
|
var __contract: {
|
|
26
22
|
readonly id: "header";
|
|
27
|
-
readonly version: "0.
|
|
28
|
-
readonly variants: readonly ["default"];
|
|
23
|
+
readonly version: "0.2.0";
|
|
24
|
+
readonly variants: readonly ["default", "actions"];
|
|
29
25
|
readonly sizes: readonly [];
|
|
30
26
|
readonly states: readonly ["default"];
|
|
31
27
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/Header.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/Header.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EAAW,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAQ,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpE,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAI3E,UAAU,WAAW;IACnB,kCAAkC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,OAAO,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC9B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,OAAmB,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,WAAW,2CA2BnG;yBA3Be,MAAM"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../src/components/TextField.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAGH,OAAO,EACL,QAAQ,EAIR,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAGtB,OAAO,
|
|
1
|
+
{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../src/components/TextField.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAGH,OAAO,EACL,QAAQ,EAIR,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAGtB,OAAO,EAIL,KAAK,aAAa,EACnB,MAAM,uBAAuB,CAAC;AAE/B;;;;;;;;;;;GAWG;AAEH,sEAAsE;AACtE,wBAAgB,uBAAuB,CAAC,EAAE,EAAE,OAAO,QAAQ,CAAC,EAAE,GAAG,SAAS,CAMzE;AAcD,UAAU,cAAc;IACtB,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IAC1C,uFAAuF;IACvF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,6BAA6B,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7E,iCAAiC;IACjC,YAAY,CAAC,EAAE,mBAAmB,CAAC;IACnC,cAAc,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,YAAY,CAAC;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC,eAAe,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC,CAAC;IACpD,mEAAmE;IACnE,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,YAAY,EACZ,WAAW,EACX,OAAmB,EACnB,QAAgB,EAChB,IAAe,EACf,UAAU,EACV,SAAS,EACT,6BAA8D,EAC9D,YAAY,EACZ,cAAc,EACd,WAAW,EACX,SAAS,EACT,aAAa,EACb,eAAe,EACf,MAAM,EACN,OAAO,EACP,KAAK,EACL,MAAM,GACP,EAAE,cAAc,2CAqDhB;yBA1Ee,SAAS"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../src/components/Toast.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAGH,OAAO,EAAmB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAI/E,OAAO,EAIL,KAAK,YAAY,EAClB,MAAM,mBAAmB,CAAC;AAE3B,UAAU,UAAU;IAClB,+BAA+B;IAC/B,OAAO,EAAE,YAAY,CAAC;IACtB,cAAc;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,KAAK,CAAC,EACpB,OAAO,EACP,OAAO,EACP,WAAW,EACX,OAAO,EACP,WAAW,EACX,QAAQ,EACR,uBAA+B,EAC/B,KAAK,EACL,MAAM,GACP,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../src/components/Toast.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAGH,OAAO,EAAmB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAI/E,OAAO,EAIL,KAAK,YAAY,EAClB,MAAM,mBAAmB,CAAC;AAE3B,UAAU,UAAU;IAClB,+BAA+B;IAC/B,OAAO,EAAE,YAAY,CAAC;IACtB,cAAc;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,KAAK,CAAC,EACpB,OAAO,EACP,OAAO,EACP,WAAW,EACX,OAAO,EACP,WAAW,EACX,QAAQ,EACR,uBAA+B,EAC/B,KAAK,EACL,MAAM,GACP,EAAE,UAAU,2CAoEZ;yBA9Ee,KAAK"}
|
|
@@ -1,11 +1,17 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* header.styles — Header の pure style resolver(styleRefs conformance 対応で Header.tsx から分離)。
|
|
3
|
-
*
|
|
4
|
-
* react-native を import しない純粋モジュールにすることで node テスト(tsx --test)から
|
|
5
|
-
* 直接実行できる。recipes/app/header.recipe.json(melta-contracts の styleRefs)との
|
|
6
|
-
* 機械照合は scripts/lib/header-conformance.test.ts が行う。
|
|
7
|
-
*/
|
|
1
|
+
/** Headerの見た目をrecipeと照合できるpure resolverへ集約する。 */
|
|
8
2
|
import type { NativeTheme, ThemeMode } from "../theme/index.js";
|
|
3
|
+
import type { VariantOf } from "../contracts/contract-types.js";
|
|
4
|
+
export declare const HEADER_SPEC: {
|
|
5
|
+
readonly gap: "3";
|
|
6
|
+
readonly actionsGap: "1";
|
|
7
|
+
readonly paddingX: "4";
|
|
8
|
+
readonly paddingY: "3";
|
|
9
|
+
readonly titleFont: "xl";
|
|
10
|
+
readonly titleWeight: "bold";
|
|
11
|
+
readonly titleColor: "text-heading";
|
|
12
|
+
readonly borderWidth: 1;
|
|
13
|
+
readonly hiddenTitleSize: 1;
|
|
14
|
+
};
|
|
9
15
|
export interface HeaderStyle {
|
|
10
16
|
containerStyle: {
|
|
11
17
|
flexDirection: "row";
|
|
@@ -20,11 +26,14 @@ export interface HeaderStyle {
|
|
|
20
26
|
titleWrapStyle: {
|
|
21
27
|
flex: 1;
|
|
22
28
|
};
|
|
29
|
+
hiddenTitleStyle?: {
|
|
30
|
+
position: "absolute";
|
|
31
|
+
width: 1;
|
|
32
|
+
height: 1;
|
|
33
|
+
overflow: "hidden";
|
|
34
|
+
};
|
|
23
35
|
}
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
* (variant="xl" weight="bold" color="text-heading" role="heading")を compose する(text recipe が正)。
|
|
28
|
-
*/
|
|
29
|
-
export declare function resolveHeaderStyle(theme: NativeTheme, mode: ThemeMode): HeaderStyle;
|
|
36
|
+
export declare function resolveHeaderStyle(theme: NativeTheme, mode: ThemeMode, props?: {
|
|
37
|
+
variant?: VariantOf<"header">;
|
|
38
|
+
}): HeaderStyle;
|
|
30
39
|
//# sourceMappingURL=header.styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/header.styles.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"header.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/header.styles.ts"],"names":[],"mappings":"AAAA,iDAAiD;AACjD,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAA0D,MAAM,mBAAmB,CAAC;AACxH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAEhE,eAAO,MAAM,WAAW;;;;;;;;;;CAQvB,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,cAAc,EAAE;QACd,aAAa,EAAE,KAAK,CAAC;QAAC,UAAU,EAAE,QAAQ,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QACxD,iBAAiB,EAAE,MAAM,CAAC;QAAC,eAAe,EAAE,MAAM,CAAC;QACnD,eAAe,EAAE,MAAM,CAAC;QAAC,iBAAiB,EAAE,CAAC,CAAC;QAAC,iBAAiB,EAAE,MAAM,CAAC;KAC1E,CAAC;IACF,cAAc,EAAE;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,CAAC;IAC5B,gBAAgB,CAAC,EAAE;QAAE,QAAQ,EAAE,UAAU,CAAC;QAAC,KAAK,EAAE,CAAC,CAAC;QAAC,MAAM,EAAE,CAAC,CAAC;QAAC,QAAQ,EAAE,QAAQ,CAAA;KAAE,CAAC;CACtF;AAED,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,GAAE;IAAE,OAAO,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAA;CAAO,GACjF,WAAW,CAkBb"}
|
|
@@ -30,6 +30,18 @@ export declare const TEXTFIELD_SIZE_SPEC: Record<TextFieldSize, {
|
|
|
30
30
|
px: SpacingKey;
|
|
31
31
|
font: FontSizeKey;
|
|
32
32
|
}>;
|
|
33
|
+
/**
|
|
34
|
+
* TextInput への縦 hitSlop(片側)。small 36 / medium 42 は視覚寸法(recipe の minHeight)を
|
|
35
|
+
* 変えずに実効タップ標的 44 を満たすための手当て(A11Y_MIN_TAP_TARGET_44・規約 10。
|
|
36
|
+
* Codex スパン監査 2026-08-06: TextField が 44pt 横断の対象から漏れていた)。
|
|
37
|
+
* 横は付けない(input は親幅いっぱいで既に広い)。値は literal(規約 10: 導出しない)。
|
|
38
|
+
*/
|
|
39
|
+
export declare const TEXTFIELD_VERTICAL_HIT_SLOP: Record<TextFieldSize, number>;
|
|
40
|
+
/** size → TextInput に渡す hitSlop。0 のときは undefined(prop を付けない)。 */
|
|
41
|
+
export declare function resolveTextFieldHitSlop(size: TextFieldSize): {
|
|
42
|
+
top: number;
|
|
43
|
+
bottom: number;
|
|
44
|
+
} | undefined;
|
|
33
45
|
/** resolver の出力(label → input → helperText / errorText の縦構成の各パート)。 */
|
|
34
46
|
export interface TextFieldResolvedStyle {
|
|
35
47
|
input: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textfield.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/textfield.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EACV,WAAW,EACX,SAAS,EACT,WAAW,EACX,eAAe,EACf,UAAU,EACX,MAAM,mBAAmB,CAAC;AAG3B,kDAAkD;AAClD,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;AAC5E,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,EAAE,MAAM,CACtC,aAAa,EACb;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,UAAU,CAAC;IAAC,IAAI,EAAE,WAAW,CAAA;CAAE,CAKzD,CAAC;AAEF,sEAAsE;AACtE,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE;QACL,mDAAmD;QACnD,SAAS,EAAE,MAAM,CAAC;QAClB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,EAAE,MAAM,CAAC;QACpB,WAAW,EAAE,MAAM,CAAC;QACpB,eAAe,EAAE,MAAM,CAAC;QACxB,YAAY,EAAE,MAAM,CAAC;QACrB,kEAAkE;QAClE,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,eAAe,CAAC;QAC5B,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,UAAU,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IACnE,SAAS,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;CACnE;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,SAAS,EACf,EACE,OAAmB,EACnB,IAAe,GAChB,GAAE;IAAE,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAAC,IAAI,CAAC,EAAE,aAAa,CAAA;CAAO,GAC3D,sBAAsB,CAgDxB;AAED;;;GAGG;AACH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,WAAW,GAAG;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,CAEtF"}
|
|
1
|
+
{"version":3,"file":"textfield.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/textfield.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EACV,WAAW,EACX,SAAS,EACT,WAAW,EACX,eAAe,EACf,UAAU,EACX,MAAM,mBAAmB,CAAC;AAG3B,kDAAkD;AAClD,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;AAC5E,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,EAAE,MAAM,CACtC,aAAa,EACb;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,UAAU,CAAC;IAAC,IAAI,EAAE,WAAW,CAAA;CAAE,CAKzD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAIrE,CAAC;AAEF,iEAAiE;AACjE,wBAAgB,uBAAuB,CACrC,IAAI,EAAE,aAAa,GAClB;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,SAAS,CAI7C;AAED,sEAAsE;AACtE,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE;QACL,mDAAmD;QACnD,SAAS,EAAE,MAAM,CAAC;QAClB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,EAAE,MAAM,CAAC;QACpB,WAAW,EAAE,MAAM,CAAC;QACpB,eAAe,EAAE,MAAM,CAAC;QACxB,YAAY,EAAE,MAAM,CAAC;QACrB,kEAAkE;QAClE,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,eAAe,CAAC;QAC5B,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,UAAU,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IACnE,SAAS,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;CACnE;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,SAAS,EACf,EACE,OAAmB,EACnB,IAAe,GAChB,GAAE;IAAE,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAAC,IAAI,CAAC,EAAE,aAAa,CAAA;CAAO,GAC3D,sBAAsB,CAgDxB;AAED;;;GAGG;AACH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,WAAW,GAAG;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,CAEtF"}
|
|
@@ -40,7 +40,9 @@ export declare const TOAST_SPEC: {
|
|
|
40
40
|
*
|
|
41
41
|
* 横を 6 に削ると × の実効幅が 24 + 6×2 = 36pt と 44pt を割るため、**箱の下限を 32pt に広げて**
|
|
42
42
|
* 32 + 6×2 = 44pt を確保する(× は背景を持たないので幅を広げても見た目は変わらない)。
|
|
43
|
-
* action
|
|
43
|
+
* action 側も同じ手当て: テキスト幅は可変だが「短いラベル("OK" 等)で 44pt を割る」のは
|
|
44
|
+
* × と同型の問題なので、見えない箱の幅下限 32 + 横 hitSlop 6×2 = 44 で静的に保証する
|
|
45
|
+
* (Codex スパン監査 2026-08-06。従来は縦のみ保証で、横は「実運用では超える」頼みだった)。
|
|
44
46
|
*/
|
|
45
47
|
export declare const TOAST_TAP_TARGET: {
|
|
46
48
|
/** action / × 共通の hitSlop(横だけ gap/2 = 6 に絞る)。 */
|
|
@@ -54,6 +56,8 @@ export declare const TOAST_TAP_TARGET: {
|
|
|
54
56
|
readonly closeMinWidth: 32;
|
|
55
57
|
/** × の箱の高さ下限(正典パターンと同値)。 */
|
|
56
58
|
readonly closeMinHeight: 24;
|
|
59
|
+
/** action の箱の幅の下限(× と同じ 32 + 6×2 = 44。背景なしなので見た目不変)。 */
|
|
60
|
+
readonly actionMinWidth: 32;
|
|
57
61
|
};
|
|
58
62
|
/**
|
|
59
63
|
* slot 構成(toast.recipe 各 variant の containerStyle / messageStyle と 1:1。
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/toast.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAEV,cAAc,EAGd,eAAe,EACf,WAAW,EAGX,SAAS,EACV,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAA8B,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGpF,qDAAqD;AACrD,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC;AAEzC;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;;CActB,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"toast.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/toast.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAEV,cAAc,EAGd,eAAe,EACf,WAAW,EAGX,SAAS,EACV,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAA8B,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGpF,qDAAqD;AACrD,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC;AAEzC;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;;CActB,CAAC;AAEF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,gBAAgB;IAC3B,iDAAiD;;;;;;;IAEjD,sEAAsE;;IAEtE,4BAA4B;;IAE5B,wDAAwD;;CAEhD,CAAC;AAEX;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,cAAc,EAAE;QACd,eAAe,EAAE,MAAM,CAAC;QACxB,YAAY,EAAE,MAAM,CAAC;QACrB,OAAO,EAAE,MAAM,CAAC;QAChB,aAAa,EAAE,KAAK,CAAC;QACrB,UAAU,EAAE,QAAQ,CAAC;QACrB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,kEAAkE;IAClE,SAAS,EAAE,cAAc,CAAC;IAC1B,kDAAkD;IAClD,YAAY,EAAE;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,eAAe,CAAC;KAC7B,CAAC;CACH;AAED,oEAAoE;AACpE,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,SAAS,EACf,OAAO,EAAE,YAAY,GACpB,WAAW,CAkBb"}
|
|
@@ -93,8 +93,8 @@ export declare const CONTRACTS: {
|
|
|
93
93
|
};
|
|
94
94
|
readonly header: {
|
|
95
95
|
readonly id: "header";
|
|
96
|
-
readonly version: "0.
|
|
97
|
-
readonly variants: readonly ["default"];
|
|
96
|
+
readonly version: "0.2.0";
|
|
97
|
+
readonly variants: readonly ["default", "actions"];
|
|
98
98
|
readonly sizes: readonly [];
|
|
99
99
|
readonly states: readonly ["default"];
|
|
100
100
|
};
|
package/llms.txt
CHANGED
|
@@ -23,7 +23,7 @@ UI を組む前に docs/patterns.md(組み方の規範)を読むこと。exa
|
|
|
23
23
|
- [card](https://melta.tsubotax.com/design/contracts/components/card.contract.json): ✅ `Card` — コンテンツコンテナ。Basic / Metrics / Media / Action / Link の5バリエーション。
|
|
24
24
|
- [checkbox](https://melta.tsubotax.com/design/contracts/components/checkbox.contract.json): ✅ `Checkbox` — 複数選択フォームコントロール。CSS 18px サイズ。
|
|
25
25
|
- [empty-state](https://melta.tsubotax.com/design/contracts/components/empty-state.contract.json): ✅ `EmptyState` — データ無し時のプレースホルダー(アイコン + タイトル + 説明 + 任意のアクション)。Text + Button の compose。
|
|
26
|
-
- [header](https://melta.tsubotax.com/design/contracts/components/header.contract.json): ✅ `Header` —
|
|
26
|
+
- [header](https://melta.tsubotax.com/design/contracts/components/header.contract.json): ✅ `Header` — 画面ヘッダー。defaultは可視見出し、actionsは見出しを視覚的に隠した操作バー。どちらも意味のあるtitleを必須とし、leading/trailingの操作を個別に読み上げる。
|
|
27
27
|
- [icon](https://melta.tsubotax.com/design/contracts/components/icon.contract.json): ✅ `Icon` — 統一アイコン primitive。name prop でグリフを選択し(グリフ集合は実装側の公開面 = assets/icons の Charcoal セット由来)、色は semantic token キー限定の prop(default
|
|
28
28
|
- [image](https://melta.tsubotax.com/design/contracts/components/image.contract.json): ✅ `Image` — 画像表示 primitive。aspectRatio / radius / contentFit / onError fallback を持つ。Phase1 は RN コア Image、expo-image は Phase2。
|
|
29
29
|
- [metric](https://melta.tsubotax.com/design/contracts/components/metric.contract.json): ✅ `Metric` — 数値 + 単位 + ラベルの指標表示 primitive(距離 / 時間 / 獲得標高 等の走行サマリー表示)。tabular-nums で桁揃え。sizes の height は数値テキストの想定行高(px)で、実 fontSize は実
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "melta-app",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"description": "melta for APP — melta デザインシステムの React Native UI kit。melta-contracts(デザイン契約)を single source of truth に RN 実装でその契約を満たす。アプリ本体ではなくライブラリ。",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"homepage": "https://app.melta.tsubotax.com",
|
|
@@ -86,7 +86,7 @@
|
|
|
86
86
|
"@types/react": "~19.2.2",
|
|
87
87
|
"eslint": "^10.4.1",
|
|
88
88
|
"jest": "^29.7.0",
|
|
89
|
-
"melta-contracts": "^0.
|
|
89
|
+
"melta-contracts": "^0.8.0",
|
|
90
90
|
"react": "19.2.3",
|
|
91
91
|
"react-native": "0.85.3",
|
|
92
92
|
"react-native-builder-bob": "^0.40.13",
|
|
@@ -117,7 +117,8 @@
|
|
|
117
117
|
"check:installability": "bash scripts/check-installability.sh",
|
|
118
118
|
"check:build-fresh": "tsx scripts/check-build-fresh.ts",
|
|
119
119
|
"release": "npm run build && npm run typecheck && npm run lint && npm test && npm run test:rn && npm run check:drift && npm run check:build-fresh && npm run check:installability && npm publish",
|
|
120
|
-
"build:llms": "tsx scripts/build-llms-txt.ts"
|
|
120
|
+
"build:llms": "tsx scripts/build-llms-txt.ts",
|
|
121
|
+
"check:header-layout": "node scripts/check-header-layout.mjs"
|
|
121
122
|
},
|
|
122
123
|
"jest": {
|
|
123
124
|
"preset": "@react-native/jest-preset",
|
package/src/a11y/tap-target.ts
CHANGED
|
@@ -27,12 +27,6 @@ export const CANONICAL_TAP_TARGET = {
|
|
|
27
27
|
hitSlop: 10,
|
|
28
28
|
} as const;
|
|
29
29
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
* ⚠️ 実装の hitSlop 値をこの関数で計算しないこと(上のコメント参照)。
|
|
34
|
-
* 使うのは (a) 値を決めるときの検算、(b) conformance テストの期待値算出。
|
|
35
|
-
*/
|
|
36
|
-
export function requiredHitSlop(visual: number): number {
|
|
37
|
-
return Math.max(0, Math.ceil((MIN_TAP_TARGET - visual) / 2));
|
|
38
|
-
}
|
|
30
|
+
// requiredHitSlop(必要 hitSlop の導出関数)は置かない — 実装値は literal 規約で導出禁止、
|
|
31
|
+
// テスト側も「実効 = 視覚 + slop×2 >= 44」を直接検算するため使い道が無い(dead code 化して撤去、
|
|
32
|
+
// Codex スパン監査 2026-08-06)。値を決めるときの検算は手計算 ceil((44 − 視覚) / 2) で足りる。
|
|
@@ -1,51 +1,52 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Header —
|
|
3
|
-
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
6
|
-
* - title は melta の Text(xl / bold / text-heading / heading role)で描画し、
|
|
7
|
-
* heading として読み上げられる(contract a11y required)。
|
|
8
|
-
* - titleWrapStyle の flex:1 で title が余白を占有し trailing を右端へ押す。
|
|
9
|
-
* - 決定ロジックは pure resolver(header.styles.ts)に分離 — recipe との機械照合対象。
|
|
2
|
+
* Header — 画面名と左右の操作を持つ共通ヘッダー。
|
|
3
|
+
* actionsでは画面名を視覚的に隠すが、独立したa11y見出しとして残す。
|
|
4
|
+
* 余白・下線・見出しの配置はheader recipeとpure resolverが所有する。
|
|
10
5
|
*/
|
|
11
|
-
|
|
12
6
|
import { useMemo, type ReactNode } from "react";
|
|
13
7
|
import { View, type StyleProp, type ViewStyle } from "react-native";
|
|
14
8
|
import { useTheme } from "../theme/index.js";
|
|
15
|
-
import { CONTRACTS } from "../contracts/contract-types.js";
|
|
9
|
+
import { CONTRACTS, type VariantOf } from "../contracts/contract-types.js";
|
|
16
10
|
import { Text } from "../primitives/Text.js";
|
|
17
|
-
import {
|
|
11
|
+
import { HEADER_SPEC, resolveHeaderStyle } from "./header.styles.js";
|
|
18
12
|
|
|
19
13
|
interface HeaderProps {
|
|
20
|
-
/**
|
|
14
|
+
/** 空でない画面名。actionsでも読み上げるため必須。 */
|
|
21
15
|
title: string;
|
|
22
|
-
/**
|
|
16
|
+
/** defaultは可視見出し、actionsは可視タイトルのない操作バー。 */
|
|
17
|
+
variant?: VariantOf<"header">;
|
|
23
18
|
leading?: ReactNode;
|
|
24
|
-
/** 右端の slot(アクション等)。 */
|
|
25
19
|
trailing?: ReactNode;
|
|
26
20
|
style?: StyleProp<ViewStyle>;
|
|
27
21
|
testID?: string;
|
|
28
22
|
}
|
|
29
23
|
|
|
30
|
-
export function Header({ title, leading, trailing, style, testID }: HeaderProps) {
|
|
24
|
+
export function Header({ title, variant = "default", leading, trailing, style, testID }: HeaderProps) {
|
|
31
25
|
const { theme, mode } = useTheme();
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
() => resolveHeaderStyle(theme, mode),
|
|
35
|
-
[theme, mode],
|
|
26
|
+
const { containerStyle, titleWrapStyle, hiddenTitleStyle } = useMemo(
|
|
27
|
+
() => resolveHeaderStyle(theme, mode, { variant }), [theme, mode, variant],
|
|
36
28
|
);
|
|
37
|
-
|
|
38
29
|
return (
|
|
39
30
|
<View style={[containerStyle, style]} testID={testID}>
|
|
40
31
|
{leading}
|
|
41
32
|
<View style={titleWrapStyle}>
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
33
|
+
{variant === "actions" ? (
|
|
34
|
+
// 見出しTextの契約を再利用し、左右の操作を親の読み上げへ畳まない。
|
|
35
|
+
<View pointerEvents="none" style={hiddenTitleStyle}>
|
|
36
|
+
<Text variant={HEADER_SPEC.titleFont} weight={HEADER_SPEC.titleWeight}
|
|
37
|
+
color={HEADER_SPEC.titleColor} role="heading" numberOfLines={1}>
|
|
38
|
+
{title}
|
|
39
|
+
</Text>
|
|
40
|
+
</View>
|
|
41
|
+
) : (
|
|
42
|
+
<Text variant={HEADER_SPEC.titleFont} weight={HEADER_SPEC.titleWeight}
|
|
43
|
+
color={HEADER_SPEC.titleColor} role="heading" numberOfLines={1}>
|
|
44
|
+
{title}
|
|
45
|
+
</Text>
|
|
46
|
+
)}
|
|
45
47
|
</View>
|
|
46
48
|
{trailing}
|
|
47
49
|
</View>
|
|
48
50
|
);
|
|
49
51
|
}
|
|
50
|
-
|
|
51
52
|
Header.__contract = CONTRACTS.header;
|
|
@@ -36,6 +36,7 @@ import {
|
|
|
36
36
|
import { useTheme } from "../theme/index.js";
|
|
37
37
|
import { CONTRACTS } from "../contracts/contract-types.js";
|
|
38
38
|
import {
|
|
39
|
+
resolveTextFieldHitSlop,
|
|
39
40
|
resolveTextFieldStyle,
|
|
40
41
|
resolveTextFieldFocusStyle,
|
|
41
42
|
type TextFieldSize,
|
|
@@ -149,6 +150,8 @@ export function TextField({
|
|
|
149
150
|
<View style={style} testID={testID}>
|
|
150
151
|
<RNText style={resolved.label}>{label}</RNText>
|
|
151
152
|
<TextInput
|
|
153
|
+
// small 36 / medium 42 の視覚寸法のまま実効タップ標的 44 を満たす(規約 10、値は literal)
|
|
154
|
+
hitSlop={resolveTextFieldHitSlop(size)}
|
|
152
155
|
value={value}
|
|
153
156
|
onChangeText={onChangeText}
|
|
154
157
|
placeholder={placeholder}
|
package/src/components/Toast.tsx
CHANGED
|
@@ -88,7 +88,17 @@ export function Toast({
|
|
|
88
88
|
{actionLabel != null && onAction != null && (
|
|
89
89
|
// 横 hitSlop は gap/2(= 6)まで。10 のままだと隣の × と当たり判定が 8pt 重なり、
|
|
90
90
|
// 手前に描かれる × が勝って「元に戻す」が押せない(toast.styles.ts の TOAST_TAP_TARGET 参照)。
|
|
91
|
-
<Pressable
|
|
91
|
+
<Pressable
|
|
92
|
+
onPress={onAction}
|
|
93
|
+
accessibilityRole="button"
|
|
94
|
+
hitSlop={TOAST_TAP_TARGET.hitSlop}
|
|
95
|
+
// 短いラベル("OK" 等)でも横の実効 44 を割らないよう × と同じ幅下限(背景なし = 見た目不変)
|
|
96
|
+
style={{
|
|
97
|
+
minWidth: TOAST_TAP_TARGET.actionMinWidth,
|
|
98
|
+
alignItems: "center",
|
|
99
|
+
justifyContent: "center",
|
|
100
|
+
}}
|
|
101
|
+
>
|
|
92
102
|
<Text
|
|
93
103
|
variant={TOAST_SPEC.messageFont}
|
|
94
104
|
weight={TOAST_SPEC.messageWeight}
|
|
@@ -1,44 +1,45 @@
|
|
|
1
|
-
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
* react-native を import しない純粋モジュールにすることで node テスト(tsx --test)から
|
|
5
|
-
* 直接実行できる。recipes/app/header.recipe.json(melta-contracts の styleRefs)との
|
|
6
|
-
* 機械照合は scripts/lib/header-conformance.test.ts が行う。
|
|
7
|
-
*/
|
|
1
|
+
/** Headerの見た目をrecipeと照合できるpure resolverへ集約する。 */
|
|
2
|
+
import type { NativeTheme, ThemeMode, SpacingKey, FontSizeKey, FontWeightKey, SemanticColors } from "../theme/index.js";
|
|
3
|
+
import type { VariantOf } from "../contracts/contract-types.js";
|
|
8
4
|
|
|
9
|
-
|
|
5
|
+
export const HEADER_SPEC = {
|
|
6
|
+
gap: "3", actionsGap: "1", paddingX: "4", paddingY: "3",
|
|
7
|
+
titleFont: "xl", titleWeight: "bold", titleColor: "text-heading",
|
|
8
|
+
borderWidth: 1, hiddenTitleSize: 1,
|
|
9
|
+
} as const satisfies {
|
|
10
|
+
gap: SpacingKey; actionsGap: SpacingKey; paddingX: SpacingKey; paddingY: SpacingKey;
|
|
11
|
+
titleFont: FontSizeKey; titleWeight: FontWeightKey; titleColor: keyof SemanticColors;
|
|
12
|
+
borderWidth: 1; hiddenTitleSize: 1;
|
|
13
|
+
};
|
|
10
14
|
|
|
11
15
|
export interface HeaderStyle {
|
|
12
16
|
containerStyle: {
|
|
13
|
-
flexDirection: "row";
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
paddingHorizontal: number;
|
|
17
|
-
paddingVertical: number;
|
|
18
|
-
backgroundColor: string;
|
|
19
|
-
borderBottomWidth: 1;
|
|
20
|
-
borderBottomColor: string;
|
|
17
|
+
flexDirection: "row"; alignItems: "center"; gap: number;
|
|
18
|
+
paddingHorizontal: number; paddingVertical: number;
|
|
19
|
+
backgroundColor: string; borderBottomWidth: 1; borderBottomColor: string;
|
|
21
20
|
};
|
|
22
21
|
titleWrapStyle: { flex: 1 };
|
|
22
|
+
hiddenTitleStyle?: { position: "absolute"; width: 1; height: 1; overflow: "hidden" };
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
* (variant="xl" weight="bold" color="text-heading" role="heading")を compose する(text recipe が正)。
|
|
29
|
-
*/
|
|
30
|
-
export function resolveHeaderStyle(theme: NativeTheme, mode: ThemeMode): HeaderStyle {
|
|
25
|
+
export function resolveHeaderStyle(
|
|
26
|
+
theme: NativeTheme, mode: ThemeMode, props: { variant?: VariantOf<"header"> } = {},
|
|
27
|
+
): HeaderStyle {
|
|
31
28
|
return {
|
|
32
29
|
containerStyle: {
|
|
33
|
-
flexDirection: "row",
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
paddingHorizontal: theme.spacing["4"],
|
|
37
|
-
paddingVertical: theme.spacing["3"],
|
|
30
|
+
flexDirection: "row", alignItems: "center", gap: theme.spacing[props.variant === "actions" ? HEADER_SPEC.actionsGap : HEADER_SPEC.gap],
|
|
31
|
+
paddingHorizontal: theme.spacing[HEADER_SPEC.paddingX],
|
|
32
|
+
paddingVertical: theme.spacing[HEADER_SPEC.paddingY],
|
|
38
33
|
backgroundColor: theme.color.semantic[mode]["bg-page"],
|
|
39
|
-
borderBottomWidth:
|
|
34
|
+
borderBottomWidth: HEADER_SPEC.borderWidth,
|
|
40
35
|
borderBottomColor: theme.color.semantic[mode]["border-default"],
|
|
41
36
|
},
|
|
42
37
|
titleWrapStyle: { flex: 1 },
|
|
38
|
+
...(props.variant === "actions" ? {
|
|
39
|
+
hiddenTitleStyle: {
|
|
40
|
+
position: "absolute" as const, width: HEADER_SPEC.hiddenTitleSize,
|
|
41
|
+
height: HEADER_SPEC.hiddenTitleSize, overflow: "hidden" as const,
|
|
42
|
+
},
|
|
43
|
+
} : {}),
|
|
43
44
|
};
|
|
44
45
|
}
|
|
@@ -44,6 +44,27 @@ export const TEXTFIELD_SIZE_SPEC: Record<
|
|
|
44
44
|
large: { minHeight: 48, px: "3", font: "lg" },
|
|
45
45
|
};
|
|
46
46
|
|
|
47
|
+
/**
|
|
48
|
+
* TextInput への縦 hitSlop(片側)。small 36 / medium 42 は視覚寸法(recipe の minHeight)を
|
|
49
|
+
* 変えずに実効タップ標的 44 を満たすための手当て(A11Y_MIN_TAP_TARGET_44・規約 10。
|
|
50
|
+
* Codex スパン監査 2026-08-06: TextField が 44pt 横断の対象から漏れていた)。
|
|
51
|
+
* 横は付けない(input は親幅いっぱいで既に広い)。値は literal(規約 10: 導出しない)。
|
|
52
|
+
*/
|
|
53
|
+
export const TEXTFIELD_VERTICAL_HIT_SLOP: Record<TextFieldSize, number> = {
|
|
54
|
+
small: 4,
|
|
55
|
+
medium: 1,
|
|
56
|
+
large: 0,
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
/** size → TextInput に渡す hitSlop。0 のときは undefined(prop を付けない)。 */
|
|
60
|
+
export function resolveTextFieldHitSlop(
|
|
61
|
+
size: TextFieldSize,
|
|
62
|
+
): { top: number; bottom: number } | undefined {
|
|
63
|
+
const slop = TEXTFIELD_VERTICAL_HIT_SLOP[size];
|
|
64
|
+
if (slop === 0) return undefined;
|
|
65
|
+
return { top: slop, bottom: slop };
|
|
66
|
+
}
|
|
67
|
+
|
|
47
68
|
/** resolver の出力(label → input → helperText / errorText の縦構成の各パート)。 */
|
|
48
69
|
export interface TextFieldResolvedStyle {
|
|
49
70
|
input: {
|
|
@@ -62,7 +62,9 @@ export const TOAST_SPEC = {
|
|
|
62
62
|
*
|
|
63
63
|
* 横を 6 に削ると × の実効幅が 24 + 6×2 = 36pt と 44pt を割るため、**箱の下限を 32pt に広げて**
|
|
64
64
|
* 32 + 6×2 = 44pt を確保する(× は背景を持たないので幅を広げても見た目は変わらない)。
|
|
65
|
-
* action
|
|
65
|
+
* action 側も同じ手当て: テキスト幅は可変だが「短いラベル("OK" 等)で 44pt を割る」のは
|
|
66
|
+
* × と同型の問題なので、見えない箱の幅下限 32 + 横 hitSlop 6×2 = 44 で静的に保証する
|
|
67
|
+
* (Codex スパン監査 2026-08-06。従来は縦のみ保証で、横は「実運用では超える」頼みだった)。
|
|
66
68
|
*/
|
|
67
69
|
export const TOAST_TAP_TARGET = {
|
|
68
70
|
/** action / × 共通の hitSlop(横だけ gap/2 = 6 に絞る)。 */
|
|
@@ -71,6 +73,8 @@ export const TOAST_TAP_TARGET = {
|
|
|
71
73
|
closeMinWidth: 32,
|
|
72
74
|
/** × の箱の高さ下限(正典パターンと同値)。 */
|
|
73
75
|
closeMinHeight: CANONICAL_TAP_TARGET.minHeight,
|
|
76
|
+
/** action の箱の幅の下限(× と同じ 32 + 6×2 = 44。背景なしなので見た目不変)。 */
|
|
77
|
+
actionMinWidth: 32,
|
|
74
78
|
} as const;
|
|
75
79
|
|
|
76
80
|
/**
|