- Harness: kintex-mobile-dev agent + kintex-mobile-orchestrator skill (WISE mobile ref, Stitch-first design rule, dual app targets B2B/B2C) - design.md v2.1: full 84-screen inventory (web 51 / admin 10 / public 8 / mobile 15) with Stitch prompts incl. ticketing (SCR-P7/P8, M14/M15) - PLANNING v3.1: unified account + split signup tracks (2FA required for staff, light signup/guest for visitors), one codebase / two app targets - Deliverables: dev plan (21s), user/operator/developer guides (17/14/15s), program spec (44s, 65 programs, 8 flowcharts), DA (DB design 14s + table spec xlsx 35 tables/299 cols) - Benchmark: ticketing-app-benchmark.md (7 apps) -> IMPLEMENTATION_BACKLOG Phase F (14 items) - Stitch: 23 generated screens saved (mobile 10, admin 6, web core 5, ticket 2) - mobile/: Expo scaffold (SDK 51, expo-router, secure store JWT) - frontend: SCR-13~17 QA fixes, icons.tsx, kintexEvents, V10 seed migration - ci/: KINTEX CI logo assets Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
35 lines
1.2 KiB
TypeScript
35 lines
1.2 KiB
TypeScript
/*
|
|
* 알림 배너 — degraded(서버 미구현/오프라인 폴백)·warning·error·info 공용.
|
|
*/
|
|
import React from 'react';
|
|
import { StyleSheet, Text, View } from 'react-native';
|
|
import { colors, radius, type } from '../theme';
|
|
|
|
type Tone = 'info' | 'warning' | 'error' | 'degraded';
|
|
|
|
const toneColor: Record<Tone, { border: string; bg: string; text: string }> = {
|
|
info: { border: colors.primary600, bg: colors.primary050, text: colors.primary700 },
|
|
warning: { border: colors.warning, bg: '#FFF7ED', text: colors.warning },
|
|
error: { border: colors.error, bg: '#FEF3F2', text: colors.error },
|
|
degraded: { border: colors.neutral500, bg: colors.neutral050, text: colors.neutral700 },
|
|
};
|
|
|
|
export function Banner({ tone = 'info', children }: { tone?: Tone; children: React.ReactNode }) {
|
|
const c = toneColor[tone];
|
|
return (
|
|
<View style={[styles.banner, { borderColor: c.border, backgroundColor: c.bg }]}>
|
|
<Text style={[styles.text, { color: c.text }]}>{children}</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
banner: {
|
|
borderWidth: 1,
|
|
borderRadius: radius.md,
|
|
paddingHorizontal: 12,
|
|
paddingVertical: 10,
|
|
},
|
|
text: { fontSize: type.body.fontSize, fontWeight: '500' },
|
|
});
|