@unif/react-native-chat 4.1.2 → 4.2.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/lib/module/components/Process/Process.js +11 -3
- package/lib/module/components/Process/Process.js.map +1 -1
- package/lib/module/components/Process/ProcessCompactStep.js +2 -1
- package/lib/module/components/Process/ProcessCompactStep.js.map +1 -1
- package/lib/module/components/Process/ProcessTimelineStep.js +2 -1
- package/lib/module/components/Process/ProcessTimelineStep.js.map +1 -1
- package/lib/module/components/Process/ProcessTraceStep.js +99 -0
- package/lib/module/components/Process/ProcessTraceStep.js.map +1 -0
- package/lib/module/components/Process/hasProcessDetails.js +7 -0
- package/lib/module/components/Process/hasProcessDetails.js.map +1 -0
- package/lib/module/components/Process/styles.js +49 -1
- package/lib/module/components/Process/styles.js.map +1 -1
- package/lib/typescript/src/components/Process/Process.d.ts.map +1 -1
- package/lib/typescript/src/components/Process/ProcessCompactStep.d.ts.map +1 -1
- package/lib/typescript/src/components/Process/ProcessTimelineStep.d.ts.map +1 -1
- package/lib/typescript/src/components/Process/ProcessTraceStep.d.ts +3 -0
- package/lib/typescript/src/components/Process/ProcessTraceStep.d.ts.map +1 -0
- package/lib/typescript/src/components/Process/hasProcessDetails.d.ts +3 -0
- package/lib/typescript/src/components/Process/hasProcessDetails.d.ts.map +1 -0
- package/lib/typescript/src/components/Process/styles.d.ts +48 -0
- package/lib/typescript/src/components/Process/styles.d.ts.map +1 -1
- package/lib/typescript/src/components/Process/types.d.ts +4 -2
- package/lib/typescript/src/components/Process/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/Process/Process.tsx +21 -5
- package/src/components/Process/ProcessCompactStep.tsx +2 -1
- package/src/components/Process/ProcessTimelineStep.tsx +2 -1
- package/src/components/Process/ProcessTraceStep.tsx +140 -0
- package/src/components/Process/hasProcessDetails.ts +6 -0
- package/src/components/Process/styles.ts +53 -1
- package/src/components/Process/types.ts +4 -2
|
@@ -5,11 +5,13 @@ import { Text, View } from 'react-native';
|
|
|
5
5
|
import { Button, r, useColors, useThemedStyles } from '@unif/react-native-design';
|
|
6
6
|
import { PROCESS_STATUS_ICONS, PROCESS_STATUS_LABELS } from "./constants.js";
|
|
7
7
|
import { createStyles } from "./styles.js";
|
|
8
|
+
import { hasProcessDetails } from "./hasProcessDetails.js";
|
|
8
9
|
import { ProcessCompactStep } from "./ProcessCompactStep.js";
|
|
9
10
|
import { ProcessTimelineStep } from "./ProcessTimelineStep.js";
|
|
11
|
+
import { ProcessTraceStep } from "./ProcessTraceStep.js";
|
|
10
12
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
11
13
|
function idsWithDetails(ids, steps) {
|
|
12
|
-
const availableIds = new Set(steps.filter(step => step.details
|
|
14
|
+
const availableIds = new Set(steps.filter(step => hasProcessDetails(step.details)).map(step => step.id));
|
|
13
15
|
return ids.filter(id => availableIds.has(id));
|
|
14
16
|
}
|
|
15
17
|
function formatElapsedMs(elapsedMs) {
|
|
@@ -53,7 +55,7 @@ export function Process(props) {
|
|
|
53
55
|
props.onExpandedChange?.(nextIds);
|
|
54
56
|
};
|
|
55
57
|
return /*#__PURE__*/_jsxs(View, {
|
|
56
|
-
style: [variant === 'compact' ? styles.compactRoot : variant === 'timeline' ? styles.timelineRoot : styles.root, style],
|
|
58
|
+
style: [variant === 'compact' ? styles.compactRoot : variant === 'trace' ? styles.traceRoot : variant === 'timeline' ? styles.timelineRoot : styles.root, style],
|
|
57
59
|
testID: testID,
|
|
58
60
|
children: [title || identity && !inlineIdentity ? /*#__PURE__*/_jsxs(View, {
|
|
59
61
|
style: styles.heading,
|
|
@@ -67,6 +69,12 @@ export function Process(props) {
|
|
|
67
69
|
const statusLabel = step.statusText ?? PROCESS_STATUS_LABELS[step.status];
|
|
68
70
|
const elapsed = formatElapsedMs(step.elapsedMs);
|
|
69
71
|
const isExpanded = expandedIds.includes(step.id);
|
|
72
|
+
if (variant === 'trace') return /*#__PURE__*/_jsx(ProcessTraceStep, {
|
|
73
|
+
step: step,
|
|
74
|
+
expanded: isExpanded,
|
|
75
|
+
elapsed: elapsed,
|
|
76
|
+
onToggle: () => toggleDetails(step.id)
|
|
77
|
+
}, step.id);
|
|
70
78
|
if (variant === 'timeline') return /*#__PURE__*/_jsx(ProcessTimelineStep, {
|
|
71
79
|
step: step,
|
|
72
80
|
last: index === steps.length - 1,
|
|
@@ -109,7 +117,7 @@ export function Process(props) {
|
|
|
109
117
|
}) : null, elapsed ? /*#__PURE__*/_jsx(Text, {
|
|
110
118
|
style: styles.elapsed,
|
|
111
119
|
children: elapsed
|
|
112
|
-
}) : null, step.details
|
|
120
|
+
}) : null, hasProcessDetails(step.details) ? /*#__PURE__*/_jsxs(_Fragment, {
|
|
113
121
|
children: [/*#__PURE__*/_jsx(Button, {
|
|
114
122
|
label: isExpanded ? '收起详情' : '展开详情',
|
|
115
123
|
onPress: () => toggleDetails(step.id),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useState","Text","View","Button","r","useColors","useThemedStyles","PROCESS_STATUS_ICONS","PROCESS_STATUS_LABELS","createStyles","ProcessCompactStep","ProcessTimelineStep","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","idsWithDetails","ids","steps","availableIds","Set","filter","step","details","map","id","has","formatElapsedMs","elapsedMs","undefined","Number","isFinite","Math","round","roundedSeconds","formatted","isInteger","String","toFixed","totalSeconds","minutes","floor","remainingSeconds","Process","props","title","identity","style","testID","variant","inlineIdentity","length","identityPlacement","styles","colors","isControlled","expandedIds","localExpandedIds","setLocalExpandedIds","defaultExpandedIds","current","toggleDetails","stepId","nextIds","includes","onExpandedChange","compactRoot","timelineRoot","root","children","heading","headingTitle","compactSteps","index","statusLabel","statusText","status","elapsed","isExpanded","
|
|
1
|
+
{"version":3,"names":["useEffect","useState","Text","View","Button","r","useColors","useThemedStyles","PROCESS_STATUS_ICONS","PROCESS_STATUS_LABELS","createStyles","hasProcessDetails","ProcessCompactStep","ProcessTimelineStep","ProcessTraceStep","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","idsWithDetails","ids","steps","availableIds","Set","filter","step","details","map","id","has","formatElapsedMs","elapsedMs","undefined","Number","isFinite","Math","round","roundedSeconds","formatted","isInteger","String","toFixed","totalSeconds","minutes","floor","remainingSeconds","Process","props","title","identity","style","testID","variant","inlineIdentity","length","identityPlacement","styles","colors","isControlled","expandedIds","localExpandedIds","setLocalExpandedIds","defaultExpandedIds","current","toggleDetails","stepId","nextIds","includes","onExpandedChange","compactRoot","traceRoot","timelineRoot","root","children","heading","headingTitle","compactSteps","index","statusLabel","statusText","status","elapsed","isExpanded","expanded","onToggle","last","dense","compactDensity","Glyph","stepLast","stepHeader","stepTitle","accessible","accessibilityLabel","size","color","error","success","foregroundMuted","description","label","onPress","actions","action","leftIcon","icon","disabled","loading","accessibilityHint"],"sourceRoot":"../../../../src","sources":["components/Process/Process.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,6 +5,7 @@ import { Pressable, ScrollView, Text, View } from 'react-native';
|
|
|
5
5
|
import { Button, Pulse, Reveal, motion, pressedOpacity, useColors, useThemedStyles } from '@unif/react-native-design';
|
|
6
6
|
import { PROCESS_STATUS_ICONS, PROCESS_STATUS_LABELS } from "./constants.js";
|
|
7
7
|
import { createStyles } from "./styles.js";
|
|
8
|
+
import { hasProcessDetails } from "./hasProcessDetails.js";
|
|
8
9
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
10
|
export function ProcessCompactStep({
|
|
10
11
|
step,
|
|
@@ -16,7 +17,7 @@ export function ProcessCompactStep({
|
|
|
16
17
|
}) {
|
|
17
18
|
const styles = useThemedStyles(createStyles);
|
|
18
19
|
const colors = useColors();
|
|
19
|
-
const hasDetails = step.details
|
|
20
|
+
const hasDetails = hasProcessDetails(step.details);
|
|
20
21
|
const running = step.status === 'running';
|
|
21
22
|
const statusText = step.statusText ?? PROCESS_STATUS_LABELS[step.status];
|
|
22
23
|
const color = running ? colors.primary : step.status === 'completed' ? colors.success : step.status === 'failed' ? colors.error : colors.foregroundMuted;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["ChevronDownOutlined","ChevronUpOutlined","SparkOutlined","Pressable","ScrollView","Text","View","Button","Pulse","Reveal","motion","pressedOpacity","useColors","useThemedStyles","PROCESS_STATUS_ICONS","PROCESS_STATUS_LABELS","createStyles","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ProcessCompactStep","step","identity","dense","expanded","elapsed","onToggle","styles","colors","hasDetails","details","running","status","statusText","color","primary","success","error","foregroundMuted","Glyph","icon","size","undefined","Glyph2","children","testID","id","accessible","accessibilityRole","accessibilityLabel","title","filter","Boolean","join","accessibilityState","accessibilityValue","text","disabled","hitSlop","onPress","style","pressed","compactHeader","compactHeaderDense","opacity","spacer","from","duration","pulse","compactTitle","numberOfLines","compactStatus","foregroundSubtle","description","compactDescription","compactDetailsContainer","compactDetailsDense","compactDetails","nestedScrollEnabled","showsVerticalScrollIndicator","keyboardShouldPersistTaps","actions","length","map","action","compactAction","label","leftIcon","loading","accessibilityHint","variant"],"sourceRoot":"../../../../src","sources":["components/Process/ProcessCompactStep.tsx"],"mappings":";;AAAA,SACEA,mBAAmB,EACnBC,iBAAiB,EACjBC,aAAa,QACR,0BAA0B;AACjC,SAASC,SAAS,EAAEC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AAChE,SACEC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,MAAM,EACNC,cAAc,EACdC,SAAS,EACTC,eAAe,QACV,2BAA2B;AAClC,SAASC,oBAAoB,EAAEC,qBAAqB,QAAQ,gBAAa;AACzE,SAASC,YAAY,QAAQ,aAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;
|
|
1
|
+
{"version":3,"names":["ChevronDownOutlined","ChevronUpOutlined","SparkOutlined","Pressable","ScrollView","Text","View","Button","Pulse","Reveal","motion","pressedOpacity","useColors","useThemedStyles","PROCESS_STATUS_ICONS","PROCESS_STATUS_LABELS","createStyles","hasProcessDetails","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ProcessCompactStep","step","identity","dense","expanded","elapsed","onToggle","styles","colors","hasDetails","details","running","status","statusText","color","primary","success","error","foregroundMuted","Glyph","icon","size","undefined","Glyph2","children","testID","id","accessible","accessibilityRole","accessibilityLabel","title","filter","Boolean","join","accessibilityState","accessibilityValue","text","disabled","hitSlop","onPress","style","pressed","compactHeader","compactHeaderDense","opacity","spacer","from","duration","pulse","compactTitle","numberOfLines","compactStatus","foregroundSubtle","description","compactDescription","compactDetailsContainer","compactDetailsDense","compactDetails","nestedScrollEnabled","showsVerticalScrollIndicator","keyboardShouldPersistTaps","actions","length","map","action","compactAction","label","leftIcon","loading","accessibilityHint","variant"],"sourceRoot":"../../../../src","sources":["components/Process/ProcessCompactStep.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,6 +5,7 @@ import { Text, View } from 'react-native';
|
|
|
5
5
|
import { Button, StatusDot, icon, useColors, useThemedStyles } from '@unif/react-native-design';
|
|
6
6
|
import { PROCESS_STATUS_LABELS } from "./constants.js";
|
|
7
7
|
import { createStyles } from "./styles.js";
|
|
8
|
+
import { hasProcessDetails } from "./hasProcessDetails.js";
|
|
8
9
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
9
10
|
export function ProcessTimelineStep({
|
|
10
11
|
step,
|
|
@@ -49,7 +50,7 @@ export function ProcessTimelineStep({
|
|
|
49
50
|
}), elapsed ? /*#__PURE__*/_jsx(Text, {
|
|
50
51
|
style: styles.elapsed,
|
|
51
52
|
children: elapsed
|
|
52
|
-
}) : null, step.details
|
|
53
|
+
}) : null, hasProcessDetails(step.details) ? /*#__PURE__*/_jsxs(_Fragment, {
|
|
53
54
|
children: [/*#__PURE__*/_jsx(Button, {
|
|
54
55
|
label: expanded ? '收起详情' : '展开详情',
|
|
55
56
|
onPress: onToggle,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["CloseOutlined","Text","View","Button","StatusDot","icon","useColors","useThemedStyles","PROCESS_STATUS_LABELS","createStyles","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ProcessTimelineStep","step","last","expanded","elapsed","onToggle","styles","colors","status","style","timelineStep","accessibilityLabel","title","statusText","children","timelineGutter","size","xs","color","foregroundSubtle","tone","timelineLine","timelineBody","timelineBodyNotLast","stepHeader","testID","id","timelineTitle","timelineActive","timelinePending","numberOfLines","description","timelineDescription","timelineError","details","label","onPress","variant","actions","length","map","action","leftIcon","disabled","loading","accessibilityHint"],"sourceRoot":"../../../../src","sources":["components/Process/ProcessTimelineStep.tsx"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,0BAA0B;AACxD,SAASC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACzC,SACEC,MAAM,EACNC,SAAS,EACTC,IAAI,EACJC,SAAS,EACTC,eAAe,QACV,2BAA2B;AAClC,SAASC,qBAAqB,QAAQ,gBAAa;AACnD,SAASC,YAAY,QAAQ,aAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;
|
|
1
|
+
{"version":3,"names":["CloseOutlined","Text","View","Button","StatusDot","icon","useColors","useThemedStyles","PROCESS_STATUS_LABELS","createStyles","hasProcessDetails","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ProcessTimelineStep","step","last","expanded","elapsed","onToggle","styles","colors","status","style","timelineStep","accessibilityLabel","title","statusText","children","timelineGutter","size","xs","color","foregroundSubtle","tone","timelineLine","timelineBody","timelineBodyNotLast","stepHeader","testID","id","timelineTitle","timelineActive","timelinePending","numberOfLines","description","timelineDescription","timelineError","details","label","onPress","variant","actions","length","map","action","leftIcon","disabled","loading","accessibilityHint"],"sourceRoot":"../../../../src","sources":["components/Process/ProcessTimelineStep.tsx"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,0BAA0B;AACxD,SAASC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACzC,SACEC,MAAM,EACNC,SAAS,EACTC,IAAI,EACJC,SAAS,EACTC,eAAe,QACV,2BAA2B;AAClC,SAASC,qBAAqB,QAAQ,gBAAa;AACnD,SAASC,YAAY,QAAQ,aAAU;AACvC,SAASC,iBAAiB,QAAQ,wBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AAGxD,OAAO,SAASC,mBAAmBA,CAAC;EAClCC,IAAI;EACJC,IAAI;EACJC,QAAQ;EACRC,OAAO;EACPC;AAC2C,CAAC,EAAE;EAC9C,MAAMC,MAAM,GAAGhB,eAAe,CAACE,YAAY,CAAC;EAC5C,MAAMe,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B,MAAMmB,MAAM,GACVP,IAAI,CAACO,MAAM,KAAK,SAAS,GACrB,QAAQ,GACRP,IAAI,CAACO,MAAM,KAAK,WAAW,GACzB,MAAM,GACNP,IAAI,CAACO,MAAM,KAAK,QAAQ,GACtB,OAAO,GACP,SAAS;EACnB,oBACEX,KAAA,CAACZ,IAAI;IACHwB,KAAK,EAAEH,MAAM,CAACI,YAAa;IAC3BC,kBAAkB,EAAE,GAAGV,IAAI,CAACW,KAAK,IAAIX,IAAI,CAACY,UAAU,IAAItB,qBAAqB,CAACU,IAAI,CAACO,MAAM,CAAC,EAAG;IAAAM,QAAA,gBAE7FjB,KAAA,CAACZ,IAAI;MAACwB,KAAK,EAAEH,MAAM,CAACS,cAAe;MAAAD,QAAA,GAChCb,IAAI,CAACO,MAAM,KAAK,WAAW,gBAC1Bb,IAAA,CAACZ,aAAa;QAACiC,IAAI,EAAE5B,IAAI,CAAC6B,EAAG;QAACC,KAAK,EAAEX,MAAM,CAACY;MAAiB,CAAE,CAAC,gBAEhExB,IAAA,CAACR,SAAS;QACRqB,MAAM,EAAEA,MAAO;QACfY,IAAI,EAAC,MAAM;QACXJ,IAAI,EAAE5B,IAAI,CAAC6B,EAAG;QACdN,kBAAkB,EAAC;MAAE,CACtB,CACF,EACA,CAACT,IAAI,gBAAGP,IAAA,CAACV,IAAI;QAACwB,KAAK,EAAEH,MAAM,CAACe;MAAa,CAAE,CAAC,GAAG,IAAI;IAAA,CAChD,CAAC,eACPxB,KAAA,CAACZ,IAAI;MAACwB,KAAK,EAAE,CAACH,MAAM,CAACgB,YAAY,EAAE,CAACpB,IAAI,IAAII,MAAM,CAACiB,mBAAmB,CAAE;MAAAT,QAAA,gBACtEjB,KAAA,CAACZ,IAAI;QAACwB,KAAK,EAAEH,MAAM,CAACkB,UAAW;QAAAV,QAAA,gBAC7BnB,IAAA,CAACX,IAAI;UACHyC,MAAM,EAAE,sBAAsBxB,IAAI,CAACyB,EAAE,EAAG;UACxCjB,KAAK,EAAE,CACLH,MAAM,CAACqB,aAAa,EACpB1B,IAAI,CAACO,MAAM,KAAK,SAAS,IAAIF,MAAM,CAACsB,cAAc,EAClD3B,IAAI,CAACO,MAAM,KAAK,SAAS,IAAIF,MAAM,CAACuB,eAAe,CACnD;UACFC,aAAa,EAAE,CAAE;UAAAhB,QAAA,EAEhBb,IAAI,CAACW;QAAK,CACP,CAAC,EACNX,IAAI,CAAC8B,WAAW,gBACfpC,IAAA,CAACX,IAAI;UACHyB,KAAK,EAAE,CACLH,MAAM,CAAC0B,mBAAmB,EAC1B/B,IAAI,CAACO,MAAM,KAAK,QAAQ,IAAIF,MAAM,CAAC2B,aAAa,CAChD;UACFH,aAAa,EAAE,CAAE;UAAAhB,QAAA,EAEhBb,IAAI,CAAC8B;QAAW,CACb,CAAC,GACL,IAAI;MAAA,CACJ,CAAC,EACN3B,OAAO,gBAAGT,IAAA,CAACX,IAAI;QAACyB,KAAK,EAAEH,MAAM,CAACF,OAAQ;QAAAU,QAAA,EAAEV;MAAO,CAAO,CAAC,GAAG,IAAI,EAC9DX,iBAAiB,CAACQ,IAAI,CAACiC,OAAO,CAAC,gBAC9BrC,KAAA,CAAAE,SAAA;QAAAe,QAAA,gBACEnB,IAAA,CAACT,MAAM;UACLiD,KAAK,EAAEhC,QAAQ,GAAG,MAAM,GAAG,MAAO;UAClCiC,OAAO,EAAE/B,QAAS;UAClBW,IAAI,EAAC,IAAI;UACTqB,OAAO,EAAC,MAAM;UACdZ,MAAM,EAAE,gBAAgBxB,IAAI,CAACyB,EAAE;QAAU,CAC1C,CAAC,EACDvB,QAAQ,gBACPR,IAAA,CAACV,IAAI;UAACwB,KAAK,EAAEH,MAAM,CAAC4B,OAAQ;UAAApB,QAAA,EAAEb,IAAI,CAACiC;QAAO,CAAO,CAAC,GAChD,IAAI;MAAA,CACR,CAAC,GACD,IAAI,EACPjC,IAAI,CAACqC,OAAO,EAAEC,MAAM,gBACnB5C,IAAA,CAACV,IAAI;QAACwB,KAAK,EAAEH,MAAM,CAACgC,OAAQ;QAAAxB,QAAA,EACzBb,IAAI,CAACqC,OAAO,CAACE,GAAG,CAAEC,MAAM,iBACvB9C,IAAA,CAACT,MAAM;UAELiD,KAAK,EAAEM,MAAM,CAACN,KAAM;UACpBO,QAAQ,EAAED,MAAM,CAACrD,IAAK;UACtBgD,OAAO,EAAEK,MAAM,CAACL,OAAQ;UACxBO,QAAQ,EAAEF,MAAM,CAACE,QAAS;UAC1BC,OAAO,EAAEH,MAAM,CAACG,OAAQ;UACxBC,iBAAiB,EAAEJ,MAAM,CAACI,iBAAkB;UAC5C7B,IAAI,EAAC,IAAI;UACTqB,OAAO,EAAC;QAAM,GARTI,MAAM,CAACf,EASb,CACF;MAAC,CACE,CAAC,GACL,IAAI;IAAA,CACJ,CAAC;EAAA,CACH,CAAC;AAEX","ignoreList":[]}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { ChevronDownOutlined, ChevronUpOutlined } from '@unif/react-native-icons';
|
|
4
|
+
import { Pressable, Text, View } from 'react-native';
|
|
5
|
+
import { Button, Card, Tag, useColors, useThemedStyles } from '@unif/react-native-design';
|
|
6
|
+
import { PROCESS_STATUS_ICONS, PROCESS_STATUS_LABELS } from "./constants.js";
|
|
7
|
+
import { createStyles } from "./styles.js";
|
|
8
|
+
import { hasProcessDetails } from "./hasProcessDetails.js";
|
|
9
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
|
+
export function ProcessTraceStep({
|
|
11
|
+
step,
|
|
12
|
+
expanded,
|
|
13
|
+
elapsed,
|
|
14
|
+
onToggle
|
|
15
|
+
}) {
|
|
16
|
+
const styles = useThemedStyles(createStyles);
|
|
17
|
+
const colors = useColors();
|
|
18
|
+
const hasDetails = hasProcessDetails(step.details);
|
|
19
|
+
const label = step.statusText ?? PROCESS_STATUS_LABELS[step.status];
|
|
20
|
+
const variant = step.status === 'failed' ? 'error' : step.status === 'completed' ? 'success' : step.status === 'running' ? 'brand' : 'neutral';
|
|
21
|
+
const color = step.status === 'failed' ? colors.error : step.status === 'completed' ? colors.success : step.status === 'running' ? colors.primary : colors.foregroundMuted;
|
|
22
|
+
const Glyph = step.icon ?? PROCESS_STATUS_ICONS[step.status];
|
|
23
|
+
const Chevron = expanded ? ChevronUpOutlined : ChevronDownOutlined;
|
|
24
|
+
const head = /*#__PURE__*/_jsxs(View, {
|
|
25
|
+
style: styles.traceHeader,
|
|
26
|
+
children: [/*#__PURE__*/_jsxs(View, {
|
|
27
|
+
style: styles.traceContent,
|
|
28
|
+
children: [/*#__PURE__*/_jsxs(View, {
|
|
29
|
+
style: styles.traceIdentity,
|
|
30
|
+
children: [step.icon !== null ? /*#__PURE__*/_jsx(View, {
|
|
31
|
+
style: styles.traceGlyph,
|
|
32
|
+
children: /*#__PURE__*/_jsx(Glyph, {
|
|
33
|
+
size: 14,
|
|
34
|
+
color: color
|
|
35
|
+
})
|
|
36
|
+
}) : null, /*#__PURE__*/_jsx(Text, {
|
|
37
|
+
style: styles.traceTitle,
|
|
38
|
+
testID: `process-step-title-${step.id}`,
|
|
39
|
+
children: step.title
|
|
40
|
+
})]
|
|
41
|
+
}), /*#__PURE__*/_jsxs(View, {
|
|
42
|
+
style: styles.traceBadges,
|
|
43
|
+
children: [step.sourceLabel ? /*#__PURE__*/_jsx(Tag, {
|
|
44
|
+
label: step.sourceLabel,
|
|
45
|
+
variant: "neutral"
|
|
46
|
+
}) : null, label || elapsed ? /*#__PURE__*/_jsx(Tag, {
|
|
47
|
+
label: [label, elapsed].filter(Boolean).join(' · '),
|
|
48
|
+
variant: variant
|
|
49
|
+
}) : null]
|
|
50
|
+
})]
|
|
51
|
+
}), hasDetails ? /*#__PURE__*/_jsx(View, {
|
|
52
|
+
style: styles.traceGlyph,
|
|
53
|
+
children: /*#__PURE__*/_jsx(Chevron, {
|
|
54
|
+
size: 16,
|
|
55
|
+
color: colors.foregroundSubtle
|
|
56
|
+
})
|
|
57
|
+
}) : null]
|
|
58
|
+
});
|
|
59
|
+
const accessibilityLabel = [step.sourceLabel, step.title, label || PROCESS_STATUS_LABELS[step.status], elapsed].filter(Boolean).join(',');
|
|
60
|
+
return /*#__PURE__*/_jsxs(Card, {
|
|
61
|
+
variant: "plain",
|
|
62
|
+
bare: true,
|
|
63
|
+
children: [hasDetails ? /*#__PURE__*/_jsx(Pressable, {
|
|
64
|
+
testID: `process-step-${step.id}-toggle`,
|
|
65
|
+
accessibilityRole: "button",
|
|
66
|
+
accessibilityLabel: accessibilityLabel,
|
|
67
|
+
accessibilityState: {
|
|
68
|
+
expanded
|
|
69
|
+
},
|
|
70
|
+
onPress: onToggle,
|
|
71
|
+
children: head
|
|
72
|
+
}) : /*#__PURE__*/_jsx(View, {
|
|
73
|
+
accessible: true,
|
|
74
|
+
accessibilityRole: "text",
|
|
75
|
+
accessibilityLabel: accessibilityLabel,
|
|
76
|
+
children: head
|
|
77
|
+
}), step.description ? /*#__PURE__*/_jsx(Text, {
|
|
78
|
+
style: styles.description,
|
|
79
|
+
children: step.description
|
|
80
|
+
}) : null, hasDetails && expanded ? /*#__PURE__*/_jsx(View, {
|
|
81
|
+
style: styles.traceDetails,
|
|
82
|
+
testID: `process-step-${step.id}-details`,
|
|
83
|
+
children: step.details
|
|
84
|
+
}) : null, step.actions?.length ? /*#__PURE__*/_jsx(View, {
|
|
85
|
+
style: styles.actions,
|
|
86
|
+
children: step.actions.map(action => /*#__PURE__*/_jsx(Button, {
|
|
87
|
+
label: action.label,
|
|
88
|
+
leftIcon: action.icon,
|
|
89
|
+
onPress: action.onPress,
|
|
90
|
+
disabled: action.disabled,
|
|
91
|
+
loading: action.loading,
|
|
92
|
+
accessibilityHint: action.accessibilityHint,
|
|
93
|
+
size: "sm",
|
|
94
|
+
variant: "text"
|
|
95
|
+
}, action.id))
|
|
96
|
+
}) : null]
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
//# sourceMappingURL=ProcessTraceStep.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["ChevronDownOutlined","ChevronUpOutlined","Pressable","Text","View","Button","Card","Tag","useColors","useThemedStyles","PROCESS_STATUS_ICONS","PROCESS_STATUS_LABELS","createStyles","hasProcessDetails","jsx","_jsx","jsxs","_jsxs","ProcessTraceStep","step","expanded","elapsed","onToggle","styles","colors","hasDetails","details","label","statusText","status","variant","color","error","success","primary","foregroundMuted","Glyph","icon","Chevron","head","style","traceHeader","children","traceContent","traceIdentity","traceGlyph","size","traceTitle","testID","id","title","traceBadges","sourceLabel","filter","Boolean","join","foregroundSubtle","accessibilityLabel","bare","accessibilityRole","accessibilityState","onPress","accessible","description","traceDetails","actions","length","map","action","leftIcon","disabled","loading","accessibilityHint"],"sourceRoot":"../../../../src","sources":["components/Process/ProcessTraceStep.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Children","hasProcessDetails","details","toArray","some","child"],"sourceRoot":"../../../../src","sources":["components/Process/hasProcessDetails.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,OAAO;AAGhC,OAAO,SAASC,iBAAiBA,CAACC,OAAkB,EAAW;EAC7D,OAAOF,QAAQ,CAACG,OAAO,CAACD,OAAO,CAAC,CAACE,IAAI,CAAEC,KAAK,IAAKA,KAAK,KAAK,EAAE,CAAC;AAChE","ignoreList":[]}
|
|
@@ -1,8 +1,56 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { StyleSheet } from 'react-native';
|
|
4
|
-
import { fw, icon, r, radius, space, type } from '@unif/react-native-design';
|
|
4
|
+
import { fontMono, fw, icon, r, radius, space, type } from '@unif/react-native-design';
|
|
5
5
|
export const createStyles = colors => StyleSheet.create({
|
|
6
|
+
traceRoot: {
|
|
7
|
+
gap: space[3]
|
|
8
|
+
},
|
|
9
|
+
traceHeader: {
|
|
10
|
+
flexDirection: 'row',
|
|
11
|
+
alignItems: 'center',
|
|
12
|
+
gap: space[3],
|
|
13
|
+
paddingVertical: space[4],
|
|
14
|
+
paddingHorizontal: space[5]
|
|
15
|
+
},
|
|
16
|
+
traceTitle: {
|
|
17
|
+
fontSize: type.xxs,
|
|
18
|
+
fontFamily: fontMono,
|
|
19
|
+
color: colors.foreground,
|
|
20
|
+
fontWeight: fw.medium,
|
|
21
|
+
flexShrink: 1
|
|
22
|
+
},
|
|
23
|
+
traceContent: {
|
|
24
|
+
flex: 1,
|
|
25
|
+
minWidth: 0,
|
|
26
|
+
flexDirection: 'row',
|
|
27
|
+
flexWrap: 'wrap',
|
|
28
|
+
alignItems: 'center',
|
|
29
|
+
gap: space[3]
|
|
30
|
+
},
|
|
31
|
+
traceIdentity: {
|
|
32
|
+
flex: 1,
|
|
33
|
+
minWidth: r(100),
|
|
34
|
+
flexDirection: 'row',
|
|
35
|
+
alignItems: 'center',
|
|
36
|
+
gap: space[3]
|
|
37
|
+
},
|
|
38
|
+
traceGlyph: {
|
|
39
|
+
flexShrink: 0
|
|
40
|
+
},
|
|
41
|
+
traceBadges: {
|
|
42
|
+
marginLeft: 'auto',
|
|
43
|
+
maxWidth: '100%',
|
|
44
|
+
flexDirection: 'row',
|
|
45
|
+
flexWrap: 'wrap',
|
|
46
|
+
gap: space[2]
|
|
47
|
+
},
|
|
48
|
+
traceDetails: {
|
|
49
|
+
paddingHorizontal: space[5],
|
|
50
|
+
paddingVertical: space[4],
|
|
51
|
+
borderTopWidth: 1,
|
|
52
|
+
borderTopColor: colors.outlineFaint
|
|
53
|
+
},
|
|
6
54
|
timelineRoot: {
|
|
7
55
|
backgroundColor: colors.surface,
|
|
8
56
|
borderRadius: radius.lg,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["StyleSheet","fw","icon","r","radius","space","type","createStyles","colors","create","
|
|
1
|
+
{"version":3,"names":["StyleSheet","fontMono","fw","icon","r","radius","space","type","createStyles","colors","create","traceRoot","gap","traceHeader","flexDirection","alignItems","paddingVertical","paddingHorizontal","traceTitle","fontSize","xxs","fontFamily","color","foreground","fontWeight","medium","flexShrink","traceContent","flex","minWidth","flexWrap","traceIdentity","traceGlyph","traceBadges","marginLeft","maxWidth","traceDetails","borderTopWidth","borderTopColor","outlineFaint","timelineRoot","backgroundColor","surface","borderRadius","lg","padding","timelineStep","timelineGutter","width","xs","alignSelf","timelineLine","outline","marginTop","minHeight","timelineBody","timelineBodyNotLast","paddingBottom","timelineTitle","lineHeight","timelineActive","primary","timelinePending","foregroundSubtle","regular","timelineDescription","timelineError","error","compactRoot","compactSteps","compactAction","compactHeader","compactHeaderDense","compactDetailsDense","paddingTop","compactTitle","foregroundMuted","spacer","compactStatus","compactDescription","compactDetailsContainer","compactDetails","maxHeight","root","xl","borderWidth","borderColor","heading","headingTitle","h3","semi","steps","step","borderBottomWidth","hairlineWidth","borderBottomColor","stepLast","stepHeader","stepTitle","sm","status","statusText","description","elapsed","details","md","surfaceContainer","actions"],"sourceRoot":"../../../../src","sources":["components/Process/styles.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Process.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/Process.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Process.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/Process.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,YAAS,CAAC;AAoCzD,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA8K9D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProcessCompactStep.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/ProcessCompactStep.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ProcessCompactStep.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/ProcessCompactStep.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAS,CAAC;AAEvD,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,KAAa,EACb,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,EAAE,uBAAuB,+BAuHzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProcessTimelineStep.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/ProcessTimelineStep.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ProcessTimelineStep.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/ProcessTimelineStep.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAS,CAAC;AAEvD,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,EAAE,uBAAuB,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,+BAyF7C"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProcessTraceStep.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/ProcessTraceStep.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAS,CAAC;AAEvD,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,EAAE,uBAAuB,+BAqHzB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hasProcessDetails.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/hasProcessDetails.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,SAAS,GAAG,OAAO,CAE7D"}
|
|
@@ -1,5 +1,53 @@
|
|
|
1
1
|
import type { ColorTokens } from '@unif/react-native-design';
|
|
2
2
|
export declare const createStyles: (colors: ColorTokens) => Readonly<{
|
|
3
|
+
traceRoot: {
|
|
4
|
+
gap: number;
|
|
5
|
+
};
|
|
6
|
+
traceHeader: {
|
|
7
|
+
flexDirection: "row";
|
|
8
|
+
alignItems: "center";
|
|
9
|
+
gap: number;
|
|
10
|
+
paddingVertical: number;
|
|
11
|
+
paddingHorizontal: number;
|
|
12
|
+
};
|
|
13
|
+
traceTitle: {
|
|
14
|
+
fontSize: number;
|
|
15
|
+
fontFamily: string;
|
|
16
|
+
color: string;
|
|
17
|
+
fontWeight: "500";
|
|
18
|
+
flexShrink: number;
|
|
19
|
+
};
|
|
20
|
+
traceContent: {
|
|
21
|
+
flex: number;
|
|
22
|
+
minWidth: number;
|
|
23
|
+
flexDirection: "row";
|
|
24
|
+
flexWrap: "wrap";
|
|
25
|
+
alignItems: "center";
|
|
26
|
+
gap: number;
|
|
27
|
+
};
|
|
28
|
+
traceIdentity: {
|
|
29
|
+
flex: number;
|
|
30
|
+
minWidth: number;
|
|
31
|
+
flexDirection: "row";
|
|
32
|
+
alignItems: "center";
|
|
33
|
+
gap: number;
|
|
34
|
+
};
|
|
35
|
+
traceGlyph: {
|
|
36
|
+
flexShrink: number;
|
|
37
|
+
};
|
|
38
|
+
traceBadges: {
|
|
39
|
+
marginLeft: string;
|
|
40
|
+
maxWidth: string;
|
|
41
|
+
flexDirection: "row";
|
|
42
|
+
flexWrap: "wrap";
|
|
43
|
+
gap: number;
|
|
44
|
+
};
|
|
45
|
+
traceDetails: {
|
|
46
|
+
paddingHorizontal: number;
|
|
47
|
+
paddingVertical: number;
|
|
48
|
+
borderTopWidth: number;
|
|
49
|
+
borderTopColor: string;
|
|
50
|
+
};
|
|
3
51
|
timelineRoot: {
|
|
4
52
|
backgroundColor: string;
|
|
5
53
|
borderRadius: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/styles.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAE7D,eAAO,MAAM,YAAY,GAAI,QAAQ,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8L5C,CAAC"}
|
|
@@ -12,14 +12,16 @@ export interface ProcessStep {
|
|
|
12
12
|
icon?: ComponentType<IconProps> | null;
|
|
13
13
|
/** 调用者提供的状态显示文案;不改变 status 的语义。 */
|
|
14
14
|
statusText?: string;
|
|
15
|
+
/** trace 中显示的来源标签,由调用方提供,如“本机”或“工具”。 */
|
|
16
|
+
sourceLabel?: string;
|
|
15
17
|
description?: string;
|
|
16
18
|
elapsedMs?: number;
|
|
17
19
|
details?: ReactNode;
|
|
18
20
|
actions?: readonly ChatAction[];
|
|
19
21
|
}
|
|
20
22
|
export interface ProcessBaseProps {
|
|
21
|
-
/** card 为状态面板;compact 为单行过程;timeline
|
|
22
|
-
variant?: 'card' | 'compact' | 'timeline';
|
|
23
|
+
/** card 为状态面板;compact 为单行过程;timeline 为连续步骤;trace 为独立工具卡。 */
|
|
24
|
+
variant?: 'card' | 'compact' | 'timeline' | 'trace';
|
|
23
25
|
/** compact 文字密度;dense 用于与行内文字相邻的公开过程。 */
|
|
24
26
|
compactDensity?: 'comfortable' | 'dense';
|
|
25
27
|
steps: readonly ProcessStep[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAe,CAAC;AAEhD,MAAM,MAAM,iBAAiB,GAC3B,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,WAAW,CAAC;AAE/D,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,iBAAiB,CAAC;IAC1B,uCAAuC;IACvC,IAAI,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IACvC,mCAAmC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,UAAU,EAAE,CAAC;CACjC;AAED,MAAM,WAAW,gBAAgB;IAC/B,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/Process/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAe,CAAC;AAEhD,MAAM,MAAM,iBAAiB,GAC3B,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,WAAW,CAAC;AAE/D,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,iBAAiB,CAAC;IAC1B,uCAAuC;IACvC,IAAI,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IACvC,mCAAmC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,UAAU,EAAE,CAAC;CACjC;AAED,MAAM,WAAW,gBAAgB;IAC/B,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;IACpD,yCAAyC;IACzC,cAAc,CAAC,EAAE,aAAa,GAAG,OAAO,CAAC;IACzC,KAAK,EAAE,SAAS,WAAW,EAAE,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACzC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,IAAI,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,0BAA0B;IACzC,WAAW,EAAE,SAAS,MAAM,EAAE,CAAC;IAC/B,gBAAgB,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,CAAC;IAC/C,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B;AAED,MAAM,WAAW,qBAAqB;IACpC,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,kBAAkB,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACvC,gBAAgB,CAAC,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,CAAC;CACjD;AAED,MAAM,MAAM,YAAY,GAAG,gBAAgB,GACzC,CAAC,0BAA0B,GAAG,qBAAqB,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -8,8 +8,10 @@ import {
|
|
|
8
8
|
} from '@unif/react-native-design';
|
|
9
9
|
import { PROCESS_STATUS_ICONS, PROCESS_STATUS_LABELS } from './constants';
|
|
10
10
|
import { createStyles } from './styles';
|
|
11
|
+
import { hasProcessDetails } from './hasProcessDetails';
|
|
11
12
|
import { ProcessCompactStep } from './ProcessCompactStep';
|
|
12
13
|
import { ProcessTimelineStep } from './ProcessTimelineStep';
|
|
14
|
+
import { ProcessTraceStep } from './ProcessTraceStep';
|
|
13
15
|
import type { ProcessProps, ProcessStep } from './types';
|
|
14
16
|
|
|
15
17
|
function idsWithDetails(
|
|
@@ -17,7 +19,9 @@ function idsWithDetails(
|
|
|
17
19
|
steps: readonly ProcessStep[]
|
|
18
20
|
): readonly string[] {
|
|
19
21
|
const availableIds = new Set(
|
|
20
|
-
steps
|
|
22
|
+
steps
|
|
23
|
+
.filter((step) => hasProcessDetails(step.details))
|
|
24
|
+
.map((step) => step.id)
|
|
21
25
|
);
|
|
22
26
|
return ids.filter((id) => availableIds.has(id));
|
|
23
27
|
}
|
|
@@ -81,9 +85,11 @@ export function Process(props: ProcessProps): React.JSX.Element {
|
|
|
81
85
|
style={[
|
|
82
86
|
variant === 'compact'
|
|
83
87
|
? styles.compactRoot
|
|
84
|
-
: variant === '
|
|
85
|
-
? styles.
|
|
86
|
-
:
|
|
88
|
+
: variant === 'trace'
|
|
89
|
+
? styles.traceRoot
|
|
90
|
+
: variant === 'timeline'
|
|
91
|
+
? styles.timelineRoot
|
|
92
|
+
: styles.root,
|
|
87
93
|
style,
|
|
88
94
|
]}
|
|
89
95
|
testID={testID}
|
|
@@ -108,6 +114,16 @@ export function Process(props: ProcessProps): React.JSX.Element {
|
|
|
108
114
|
step.statusText ?? PROCESS_STATUS_LABELS[step.status];
|
|
109
115
|
const elapsed = formatElapsedMs(step.elapsedMs);
|
|
110
116
|
const isExpanded = expandedIds.includes(step.id);
|
|
117
|
+
if (variant === 'trace')
|
|
118
|
+
return (
|
|
119
|
+
<ProcessTraceStep
|
|
120
|
+
key={step.id}
|
|
121
|
+
step={step}
|
|
122
|
+
expanded={isExpanded}
|
|
123
|
+
elapsed={elapsed}
|
|
124
|
+
onToggle={() => toggleDetails(step.id)}
|
|
125
|
+
/>
|
|
126
|
+
);
|
|
111
127
|
if (variant === 'timeline')
|
|
112
128
|
return (
|
|
113
129
|
<ProcessTimelineStep
|
|
@@ -169,7 +185,7 @@ export function Process(props: ProcessProps): React.JSX.Element {
|
|
|
169
185
|
<Text style={styles.description}>{step.description}</Text>
|
|
170
186
|
) : null}
|
|
171
187
|
{elapsed ? <Text style={styles.elapsed}>{elapsed}</Text> : null}
|
|
172
|
-
{step.details
|
|
188
|
+
{hasProcessDetails(step.details) ? (
|
|
173
189
|
<>
|
|
174
190
|
<Button
|
|
175
191
|
label={isExpanded ? '收起详情' : '展开详情'}
|
|
@@ -15,6 +15,7 @@ import {
|
|
|
15
15
|
} from '@unif/react-native-design';
|
|
16
16
|
import { PROCESS_STATUS_ICONS, PROCESS_STATUS_LABELS } from './constants';
|
|
17
17
|
import { createStyles } from './styles';
|
|
18
|
+
import { hasProcessDetails } from './hasProcessDetails';
|
|
18
19
|
import type { ProcessCompactStepProps } from './types';
|
|
19
20
|
|
|
20
21
|
export function ProcessCompactStep({
|
|
@@ -27,7 +28,7 @@ export function ProcessCompactStep({
|
|
|
27
28
|
}: ProcessCompactStepProps) {
|
|
28
29
|
const styles = useThemedStyles(createStyles);
|
|
29
30
|
const colors = useColors();
|
|
30
|
-
const hasDetails = step.details
|
|
31
|
+
const hasDetails = hasProcessDetails(step.details);
|
|
31
32
|
const running = step.status === 'running';
|
|
32
33
|
const statusText = step.statusText ?? PROCESS_STATUS_LABELS[step.status];
|
|
33
34
|
const color = running
|
|
@@ -9,6 +9,7 @@ import {
|
|
|
9
9
|
} from '@unif/react-native-design';
|
|
10
10
|
import { PROCESS_STATUS_LABELS } from './constants';
|
|
11
11
|
import { createStyles } from './styles';
|
|
12
|
+
import { hasProcessDetails } from './hasProcessDetails';
|
|
12
13
|
import type { ProcessCompactStepProps } from './types';
|
|
13
14
|
|
|
14
15
|
export function ProcessTimelineStep({
|
|
@@ -72,7 +73,7 @@ export function ProcessTimelineStep({
|
|
|
72
73
|
) : null}
|
|
73
74
|
</View>
|
|
74
75
|
{elapsed ? <Text style={styles.elapsed}>{elapsed}</Text> : null}
|
|
75
|
-
{step.details
|
|
76
|
+
{hasProcessDetails(step.details) ? (
|
|
76
77
|
<>
|
|
77
78
|
<Button
|
|
78
79
|
label={expanded ? '收起详情' : '展开详情'}
|
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
import {
|
|
2
|
+
ChevronDownOutlined,
|
|
3
|
+
ChevronUpOutlined,
|
|
4
|
+
} from '@unif/react-native-icons';
|
|
5
|
+
import { Pressable, Text, View } from 'react-native';
|
|
6
|
+
import {
|
|
7
|
+
Button,
|
|
8
|
+
Card,
|
|
9
|
+
Tag,
|
|
10
|
+
useColors,
|
|
11
|
+
useThemedStyles,
|
|
12
|
+
} from '@unif/react-native-design';
|
|
13
|
+
import { PROCESS_STATUS_ICONS, PROCESS_STATUS_LABELS } from './constants';
|
|
14
|
+
import { createStyles } from './styles';
|
|
15
|
+
import { hasProcessDetails } from './hasProcessDetails';
|
|
16
|
+
import type { ProcessCompactStepProps } from './types';
|
|
17
|
+
|
|
18
|
+
export function ProcessTraceStep({
|
|
19
|
+
step,
|
|
20
|
+
expanded,
|
|
21
|
+
elapsed,
|
|
22
|
+
onToggle,
|
|
23
|
+
}: ProcessCompactStepProps) {
|
|
24
|
+
const styles = useThemedStyles(createStyles);
|
|
25
|
+
const colors = useColors();
|
|
26
|
+
const hasDetails = hasProcessDetails(step.details);
|
|
27
|
+
const label = step.statusText ?? PROCESS_STATUS_LABELS[step.status];
|
|
28
|
+
const variant =
|
|
29
|
+
step.status === 'failed'
|
|
30
|
+
? 'error'
|
|
31
|
+
: step.status === 'completed'
|
|
32
|
+
? 'success'
|
|
33
|
+
: step.status === 'running'
|
|
34
|
+
? 'brand'
|
|
35
|
+
: 'neutral';
|
|
36
|
+
const color =
|
|
37
|
+
step.status === 'failed'
|
|
38
|
+
? colors.error
|
|
39
|
+
: step.status === 'completed'
|
|
40
|
+
? colors.success
|
|
41
|
+
: step.status === 'running'
|
|
42
|
+
? colors.primary
|
|
43
|
+
: colors.foregroundMuted;
|
|
44
|
+
const Glyph = step.icon ?? PROCESS_STATUS_ICONS[step.status];
|
|
45
|
+
const Chevron = expanded ? ChevronUpOutlined : ChevronDownOutlined;
|
|
46
|
+
const head = (
|
|
47
|
+
<View style={styles.traceHeader}>
|
|
48
|
+
<View style={styles.traceContent}>
|
|
49
|
+
<View style={styles.traceIdentity}>
|
|
50
|
+
{step.icon !== null ? (
|
|
51
|
+
<View style={styles.traceGlyph}>
|
|
52
|
+
<Glyph size={14} color={color} />
|
|
53
|
+
</View>
|
|
54
|
+
) : null}
|
|
55
|
+
<Text
|
|
56
|
+
style={styles.traceTitle}
|
|
57
|
+
testID={`process-step-title-${step.id}`}
|
|
58
|
+
>
|
|
59
|
+
{step.title}
|
|
60
|
+
</Text>
|
|
61
|
+
</View>
|
|
62
|
+
<View style={styles.traceBadges}>
|
|
63
|
+
{step.sourceLabel ? (
|
|
64
|
+
<Tag label={step.sourceLabel} variant="neutral" />
|
|
65
|
+
) : null}
|
|
66
|
+
{label || elapsed ? (
|
|
67
|
+
<Tag
|
|
68
|
+
label={[label, elapsed].filter(Boolean).join(' · ')}
|
|
69
|
+
variant={variant}
|
|
70
|
+
/>
|
|
71
|
+
) : null}
|
|
72
|
+
</View>
|
|
73
|
+
</View>
|
|
74
|
+
{hasDetails ? (
|
|
75
|
+
<View style={styles.traceGlyph}>
|
|
76
|
+
<Chevron size={16} color={colors.foregroundSubtle} />
|
|
77
|
+
</View>
|
|
78
|
+
) : null}
|
|
79
|
+
</View>
|
|
80
|
+
);
|
|
81
|
+
const accessibilityLabel = [
|
|
82
|
+
step.sourceLabel,
|
|
83
|
+
step.title,
|
|
84
|
+
label || PROCESS_STATUS_LABELS[step.status],
|
|
85
|
+
elapsed,
|
|
86
|
+
]
|
|
87
|
+
.filter(Boolean)
|
|
88
|
+
.join(',');
|
|
89
|
+
return (
|
|
90
|
+
<Card variant="plain" bare>
|
|
91
|
+
{hasDetails ? (
|
|
92
|
+
<Pressable
|
|
93
|
+
testID={`process-step-${step.id}-toggle`}
|
|
94
|
+
accessibilityRole="button"
|
|
95
|
+
accessibilityLabel={accessibilityLabel}
|
|
96
|
+
accessibilityState={{ expanded }}
|
|
97
|
+
onPress={onToggle}
|
|
98
|
+
>
|
|
99
|
+
{head}
|
|
100
|
+
</Pressable>
|
|
101
|
+
) : (
|
|
102
|
+
<View
|
|
103
|
+
accessible
|
|
104
|
+
accessibilityRole="text"
|
|
105
|
+
accessibilityLabel={accessibilityLabel}
|
|
106
|
+
>
|
|
107
|
+
{head}
|
|
108
|
+
</View>
|
|
109
|
+
)}
|
|
110
|
+
{step.description ? (
|
|
111
|
+
<Text style={styles.description}>{step.description}</Text>
|
|
112
|
+
) : null}
|
|
113
|
+
{hasDetails && expanded ? (
|
|
114
|
+
<View
|
|
115
|
+
style={styles.traceDetails}
|
|
116
|
+
testID={`process-step-${step.id}-details`}
|
|
117
|
+
>
|
|
118
|
+
{step.details}
|
|
119
|
+
</View>
|
|
120
|
+
) : null}
|
|
121
|
+
{step.actions?.length ? (
|
|
122
|
+
<View style={styles.actions}>
|
|
123
|
+
{step.actions.map((action) => (
|
|
124
|
+
<Button
|
|
125
|
+
key={action.id}
|
|
126
|
+
label={action.label}
|
|
127
|
+
leftIcon={action.icon}
|
|
128
|
+
onPress={action.onPress}
|
|
129
|
+
disabled={action.disabled}
|
|
130
|
+
loading={action.loading}
|
|
131
|
+
accessibilityHint={action.accessibilityHint}
|
|
132
|
+
size="sm"
|
|
133
|
+
variant="text"
|
|
134
|
+
/>
|
|
135
|
+
))}
|
|
136
|
+
</View>
|
|
137
|
+
) : null}
|
|
138
|
+
</Card>
|
|
139
|
+
);
|
|
140
|
+
}
|
|
@@ -1,9 +1,61 @@
|
|
|
1
1
|
import { StyleSheet } from 'react-native';
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
fontMono,
|
|
4
|
+
fw,
|
|
5
|
+
icon,
|
|
6
|
+
r,
|
|
7
|
+
radius,
|
|
8
|
+
space,
|
|
9
|
+
type,
|
|
10
|
+
} from '@unif/react-native-design';
|
|
3
11
|
import type { ColorTokens } from '@unif/react-native-design';
|
|
4
12
|
|
|
5
13
|
export const createStyles = (colors: ColorTokens) =>
|
|
6
14
|
StyleSheet.create({
|
|
15
|
+
traceRoot: { gap: space[3] },
|
|
16
|
+
traceHeader: {
|
|
17
|
+
flexDirection: 'row',
|
|
18
|
+
alignItems: 'center',
|
|
19
|
+
gap: space[3],
|
|
20
|
+
paddingVertical: space[4],
|
|
21
|
+
paddingHorizontal: space[5],
|
|
22
|
+
},
|
|
23
|
+
traceTitle: {
|
|
24
|
+
fontSize: type.xxs,
|
|
25
|
+
fontFamily: fontMono,
|
|
26
|
+
color: colors.foreground,
|
|
27
|
+
fontWeight: fw.medium,
|
|
28
|
+
flexShrink: 1,
|
|
29
|
+
},
|
|
30
|
+
traceContent: {
|
|
31
|
+
flex: 1,
|
|
32
|
+
minWidth: 0,
|
|
33
|
+
flexDirection: 'row',
|
|
34
|
+
flexWrap: 'wrap',
|
|
35
|
+
alignItems: 'center',
|
|
36
|
+
gap: space[3],
|
|
37
|
+
},
|
|
38
|
+
traceIdentity: {
|
|
39
|
+
flex: 1,
|
|
40
|
+
minWidth: r(100),
|
|
41
|
+
flexDirection: 'row',
|
|
42
|
+
alignItems: 'center',
|
|
43
|
+
gap: space[3],
|
|
44
|
+
},
|
|
45
|
+
traceGlyph: { flexShrink: 0 },
|
|
46
|
+
traceBadges: {
|
|
47
|
+
marginLeft: 'auto',
|
|
48
|
+
maxWidth: '100%',
|
|
49
|
+
flexDirection: 'row',
|
|
50
|
+
flexWrap: 'wrap',
|
|
51
|
+
gap: space[2],
|
|
52
|
+
},
|
|
53
|
+
traceDetails: {
|
|
54
|
+
paddingHorizontal: space[5],
|
|
55
|
+
paddingVertical: space[4],
|
|
56
|
+
borderTopWidth: 1,
|
|
57
|
+
borderTopColor: colors.outlineFaint,
|
|
58
|
+
},
|
|
7
59
|
timelineRoot: {
|
|
8
60
|
backgroundColor: colors.surface,
|
|
9
61
|
borderRadius: radius.lg,
|
|
@@ -16,6 +16,8 @@ export interface ProcessStep {
|
|
|
16
16
|
icon?: ComponentType<IconProps> | null;
|
|
17
17
|
/** 调用者提供的状态显示文案;不改变 status 的语义。 */
|
|
18
18
|
statusText?: string;
|
|
19
|
+
/** trace 中显示的来源标签,由调用方提供,如“本机”或“工具”。 */
|
|
20
|
+
sourceLabel?: string;
|
|
19
21
|
description?: string;
|
|
20
22
|
elapsedMs?: number;
|
|
21
23
|
details?: ReactNode;
|
|
@@ -23,8 +25,8 @@ export interface ProcessStep {
|
|
|
23
25
|
}
|
|
24
26
|
|
|
25
27
|
export interface ProcessBaseProps {
|
|
26
|
-
/** card 为状态面板;compact 为单行过程;timeline
|
|
27
|
-
variant?: 'card' | 'compact' | 'timeline';
|
|
28
|
+
/** card 为状态面板;compact 为单行过程;timeline 为连续步骤;trace 为独立工具卡。 */
|
|
29
|
+
variant?: 'card' | 'compact' | 'timeline' | 'trace';
|
|
28
30
|
/** compact 文字密度;dense 用于与行内文字相邻的公开过程。 */
|
|
29
31
|
compactDensity?: 'comfortable' | 'dense';
|
|
30
32
|
steps: readonly ProcessStep[];
|