@designbasekorea/ui-native 0.1.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 +152 -0
- package/dist/components/Alert/Alert.d.ts +29 -0
- package/dist/components/Alert/Alert.d.ts.map +1 -0
- package/dist/components/Alert/Alert.js +44 -0
- package/dist/components/Alert/Alert.js.map +1 -0
- package/dist/components/Alert/index.d.ts +3 -0
- package/dist/components/Alert/index.d.ts.map +1 -0
- package/dist/components/Alert/index.js +2 -0
- package/dist/components/Alert/index.js.map +1 -0
- package/dist/components/Avatar/Avatar.d.ts +28 -0
- package/dist/components/Avatar/Avatar.d.ts.map +1 -0
- package/dist/components/Avatar/Avatar.js +73 -0
- package/dist/components/Avatar/Avatar.js.map +1 -0
- package/dist/components/Avatar/index.d.ts +3 -0
- package/dist/components/Avatar/index.d.ts.map +1 -0
- package/dist/components/Avatar/index.js +2 -0
- package/dist/components/Avatar/index.js.map +1 -0
- package/dist/components/Badge/Badge.d.ts +28 -0
- package/dist/components/Badge/Badge.d.ts.map +1 -0
- package/dist/components/Badge/Badge.js +52 -0
- package/dist/components/Badge/Badge.js.map +1 -0
- package/dist/components/Badge/index.d.ts +3 -0
- package/dist/components/Badge/index.d.ts.map +1 -0
- package/dist/components/Badge/index.js +2 -0
- package/dist/components/Badge/index.js.map +1 -0
- package/dist/components/BottomNavigation/BottomNavigation.d.ts +30 -0
- package/dist/components/BottomNavigation/BottomNavigation.d.ts.map +1 -0
- package/dist/components/BottomNavigation/BottomNavigation.js +48 -0
- package/dist/components/BottomNavigation/BottomNavigation.js.map +1 -0
- package/dist/components/BottomNavigation/index.d.ts +3 -0
- package/dist/components/BottomNavigation/index.d.ts.map +1 -0
- package/dist/components/BottomNavigation/index.js +2 -0
- package/dist/components/BottomNavigation/index.js.map +1 -0
- package/dist/components/BottomSheet/BottomSheet.d.ts +26 -0
- package/dist/components/BottomSheet/BottomSheet.d.ts.map +1 -0
- package/dist/components/BottomSheet/BottomSheet.js +75 -0
- package/dist/components/BottomSheet/BottomSheet.js.map +1 -0
- package/dist/components/BottomSheet/index.d.ts +3 -0
- package/dist/components/BottomSheet/index.d.ts.map +1 -0
- package/dist/components/BottomSheet/index.js +2 -0
- package/dist/components/BottomSheet/index.js.map +1 -0
- package/dist/components/Button/Button.d.ts +53 -0
- package/dist/components/Button/Button.d.ts.map +1 -0
- package/dist/components/Button/Button.js +129 -0
- package/dist/components/Button/Button.js.map +1 -0
- package/dist/components/Button/index.d.ts +3 -0
- package/dist/components/Button/index.d.ts.map +1 -0
- package/dist/components/Button/index.js +2 -0
- package/dist/components/Button/index.js.map +1 -0
- package/dist/components/Card/Card.d.ts +36 -0
- package/dist/components/Card/Card.d.ts.map +1 -0
- package/dist/components/Card/Card.js +61 -0
- package/dist/components/Card/Card.js.map +1 -0
- package/dist/components/Card/index.d.ts +3 -0
- package/dist/components/Card/index.d.ts.map +1 -0
- package/dist/components/Card/index.js +2 -0
- package/dist/components/Card/index.js.map +1 -0
- package/dist/components/Checkbox/Checkbox.d.ts +26 -0
- package/dist/components/Checkbox/Checkbox.d.ts.map +1 -0
- package/dist/components/Checkbox/Checkbox.js +57 -0
- package/dist/components/Checkbox/Checkbox.js.map +1 -0
- package/dist/components/Checkbox/index.d.ts +3 -0
- package/dist/components/Checkbox/index.d.ts.map +1 -0
- package/dist/components/Checkbox/index.js +2 -0
- package/dist/components/Checkbox/index.js.map +1 -0
- package/dist/components/Chip/Chip.d.ts +29 -0
- package/dist/components/Chip/Chip.d.ts.map +1 -0
- package/dist/components/Chip/Chip.js +54 -0
- package/dist/components/Chip/Chip.js.map +1 -0
- package/dist/components/Chip/index.d.ts +3 -0
- package/dist/components/Chip/index.d.ts.map +1 -0
- package/dist/components/Chip/index.js +2 -0
- package/dist/components/Chip/index.js.map +1 -0
- package/dist/components/Divider/Divider.d.ts +22 -0
- package/dist/components/Divider/Divider.d.ts.map +1 -0
- package/dist/components/Divider/Divider.js +16 -0
- package/dist/components/Divider/Divider.js.map +1 -0
- package/dist/components/Divider/index.d.ts +3 -0
- package/dist/components/Divider/index.d.ts.map +1 -0
- package/dist/components/Divider/index.js +2 -0
- package/dist/components/Divider/index.js.map +1 -0
- package/dist/components/Input/Input.d.ts +33 -0
- package/dist/components/Input/Input.d.ts.map +1 -0
- package/dist/components/Input/Input.js +98 -0
- package/dist/components/Input/Input.js.map +1 -0
- package/dist/components/Input/index.d.ts +3 -0
- package/dist/components/Input/index.d.ts.map +1 -0
- package/dist/components/Input/index.js +2 -0
- package/dist/components/Input/index.js.map +1 -0
- package/dist/components/Modal/Modal.d.ts +28 -0
- package/dist/components/Modal/Modal.d.ts.map +1 -0
- package/dist/components/Modal/Modal.js +46 -0
- package/dist/components/Modal/Modal.js.map +1 -0
- package/dist/components/Modal/index.d.ts +3 -0
- package/dist/components/Modal/index.d.ts.map +1 -0
- package/dist/components/Modal/index.js +2 -0
- package/dist/components/Modal/index.js.map +1 -0
- package/dist/components/Navbar/Navbar.d.ts +50 -0
- package/dist/components/Navbar/Navbar.d.ts.map +1 -0
- package/dist/components/Navbar/Navbar.js +125 -0
- package/dist/components/Navbar/Navbar.js.map +1 -0
- package/dist/components/Navbar/index.d.ts +3 -0
- package/dist/components/Navbar/index.d.ts.map +1 -0
- package/dist/components/Navbar/index.js +2 -0
- package/dist/components/Navbar/index.js.map +1 -0
- package/dist/components/ProgressBar/ProgressBar.d.ts +27 -0
- package/dist/components/ProgressBar/ProgressBar.d.ts.map +1 -0
- package/dist/components/ProgressBar/ProgressBar.js +55 -0
- package/dist/components/ProgressBar/ProgressBar.js.map +1 -0
- package/dist/components/ProgressBar/index.d.ts +3 -0
- package/dist/components/ProgressBar/index.d.ts.map +1 -0
- package/dist/components/ProgressBar/index.js +2 -0
- package/dist/components/ProgressBar/index.js.map +1 -0
- package/dist/components/Radio/Radio.d.ts +30 -0
- package/dist/components/Radio/Radio.d.ts.map +1 -0
- package/dist/components/Radio/Radio.js +56 -0
- package/dist/components/Radio/Radio.js.map +1 -0
- package/dist/components/Radio/index.d.ts +3 -0
- package/dist/components/Radio/index.d.ts.map +1 -0
- package/dist/components/Radio/index.js +2 -0
- package/dist/components/Radio/index.js.map +1 -0
- package/dist/components/SearchBar/SearchBar.d.ts +29 -0
- package/dist/components/SearchBar/SearchBar.d.ts.map +1 -0
- package/dist/components/SearchBar/SearchBar.js +64 -0
- package/dist/components/SearchBar/SearchBar.js.map +1 -0
- package/dist/components/SearchBar/index.d.ts +3 -0
- package/dist/components/SearchBar/index.d.ts.map +1 -0
- package/dist/components/SearchBar/index.js +2 -0
- package/dist/components/SearchBar/index.js.map +1 -0
- package/dist/components/Skeleton/Skeleton.d.ts +22 -0
- package/dist/components/Skeleton/Skeleton.d.ts.map +1 -0
- package/dist/components/Skeleton/Skeleton.js +46 -0
- package/dist/components/Skeleton/Skeleton.js.map +1 -0
- package/dist/components/Skeleton/index.d.ts +3 -0
- package/dist/components/Skeleton/index.d.ts.map +1 -0
- package/dist/components/Skeleton/index.js +2 -0
- package/dist/components/Skeleton/index.js.map +1 -0
- package/dist/components/Spinner/Spinner.d.ts +23 -0
- package/dist/components/Spinner/Spinner.d.ts.map +1 -0
- package/dist/components/Spinner/Spinner.js +19 -0
- package/dist/components/Spinner/Spinner.js.map +1 -0
- package/dist/components/Spinner/index.d.ts +3 -0
- package/dist/components/Spinner/index.d.ts.map +1 -0
- package/dist/components/Spinner/index.js +2 -0
- package/dist/components/Spinner/index.js.map +1 -0
- package/dist/components/Tabs/Tabs.d.ts +30 -0
- package/dist/components/Tabs/Tabs.d.ts.map +1 -0
- package/dist/components/Tabs/Tabs.js +73 -0
- package/dist/components/Tabs/Tabs.js.map +1 -0
- package/dist/components/Tabs/index.d.ts +3 -0
- package/dist/components/Tabs/index.d.ts.map +1 -0
- package/dist/components/Tabs/index.js +2 -0
- package/dist/components/Tabs/index.js.map +1 -0
- package/dist/components/Toast/Toast.d.ts +30 -0
- package/dist/components/Toast/Toast.d.ts.map +1 -0
- package/dist/components/Toast/Toast.js +84 -0
- package/dist/components/Toast/Toast.js.map +1 -0
- package/dist/components/Toast/index.d.ts +3 -0
- package/dist/components/Toast/index.d.ts.map +1 -0
- package/dist/components/Toast/index.js +2 -0
- package/dist/components/Toast/index.js.map +1 -0
- package/dist/components/Toggle/Toggle.d.ts +26 -0
- package/dist/components/Toggle/Toggle.d.ts.map +1 -0
- package/dist/components/Toggle/Toggle.js +75 -0
- package/dist/components/Toggle/Toggle.js.map +1 -0
- package/dist/components/Toggle/index.d.ts +3 -0
- package/dist/components/Toggle/index.d.ts.map +1 -0
- package/dist/components/Toggle/index.js +2 -0
- package/dist/components/Toggle/index.js.map +1 -0
- package/dist/index.d.ts +61 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +43 -0
- package/dist/index.js.map +1 -0
- package/dist/theme/ThemeProvider.d.ts +35 -0
- package/dist/theme/ThemeProvider.d.ts.map +1 -0
- package/dist/theme/ThemeProvider.js +45 -0
- package/dist/theme/ThemeProvider.js.map +1 -0
- package/dist/theme/index.d.ts +6 -0
- package/dist/theme/index.d.ts.map +1 -0
- package/dist/theme/index.js +4 -0
- package/dist/theme/index.js.map +1 -0
- package/dist/theme/tokens.d.ts +55 -0
- package/dist/theme/tokens.d.ts.map +1 -0
- package/dist/theme/tokens.js +172 -0
- package/dist/theme/tokens.js.map +1 -0
- package/dist/theme/useTheme.d.ts +25 -0
- package/dist/theme/useTheme.d.ts.map +1 -0
- package/dist/theme/useTheme.js +33 -0
- package/dist/theme/useTheme.js.map +1 -0
- package/package.json +58 -0
- package/src/components/Alert/Alert.tsx +105 -0
- package/src/components/Alert/index.ts +2 -0
- package/src/components/Avatar/Avatar.tsx +122 -0
- package/src/components/Avatar/index.ts +2 -0
- package/src/components/Badge/Badge.tsx +100 -0
- package/src/components/Badge/index.ts +2 -0
- package/src/components/BottomNavigation/BottomNavigation.tsx +104 -0
- package/src/components/BottomNavigation/index.ts +2 -0
- package/src/components/BottomSheet/BottomSheet.tsx +127 -0
- package/src/components/BottomSheet/index.ts +2 -0
- package/src/components/Button/Button.tsx +255 -0
- package/src/components/Button/index.ts +2 -0
- package/src/components/Card/Card.tsx +147 -0
- package/src/components/Card/index.ts +2 -0
- package/src/components/Checkbox/Checkbox.tsx +95 -0
- package/src/components/Checkbox/index.ts +2 -0
- package/src/components/Chip/Chip.tsx +108 -0
- package/src/components/Chip/index.ts +2 -0
- package/src/components/Divider/Divider.tsx +41 -0
- package/src/components/Divider/index.ts +2 -0
- package/src/components/Input/Input.tsx +199 -0
- package/src/components/Input/index.ts +2 -0
- package/src/components/Modal/Modal.tsx +117 -0
- package/src/components/Modal/index.ts +2 -0
- package/src/components/Navbar/Navbar.tsx +278 -0
- package/src/components/Navbar/index.ts +2 -0
- package/src/components/ProgressBar/ProgressBar.tsx +99 -0
- package/src/components/ProgressBar/index.ts +2 -0
- package/src/components/Radio/Radio.tsx +103 -0
- package/src/components/Radio/index.ts +2 -0
- package/src/components/SearchBar/SearchBar.tsx +115 -0
- package/src/components/SearchBar/index.ts +2 -0
- package/src/components/Skeleton/Skeleton.tsx +74 -0
- package/src/components/Skeleton/index.ts +2 -0
- package/src/components/Spinner/Spinner.tsx +58 -0
- package/src/components/Spinner/index.ts +2 -0
- package/src/components/Tabs/Tabs.tsx +124 -0
- package/src/components/Tabs/index.ts +2 -0
- package/src/components/Toast/Toast.tsx +128 -0
- package/src/components/Toast/index.ts +2 -0
- package/src/components/Toggle/Toggle.tsx +109 -0
- package/src/components/Toggle/index.ts +2 -0
- package/src/index.ts +87 -0
- package/src/theme/ThemeProvider.tsx +96 -0
- package/src/theme/index.ts +5 -0
- package/src/theme/tokens.ts +225 -0
- package/src/theme/useTheme.ts +37 -0
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Chip 컴포넌트 (React Native)
|
|
3
|
+
*
|
|
4
|
+
* 스타일링 토큰 경로:
|
|
5
|
+
* - 색상: theme.color.aliases.{brand|surface|text|feedback}.*
|
|
6
|
+
* - 폰트: theme.typography.foundation.fontSize.{xs|s|base}
|
|
7
|
+
* - 간격: theme.spacing.aliases.padding.{xs|s|m}
|
|
8
|
+
*
|
|
9
|
+
* 원본: packages/ui/src/components/Chip/Chip.tsx
|
|
10
|
+
*/
|
|
11
|
+
import React from 'react';
|
|
12
|
+
import { type ViewStyle } from 'react-native';
|
|
13
|
+
export type ChipSize = 's' | 'm' | 'l';
|
|
14
|
+
export type ChipVariant = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'outlined';
|
|
15
|
+
export interface ChipProps {
|
|
16
|
+
label: string;
|
|
17
|
+
size?: ChipSize;
|
|
18
|
+
variant?: ChipVariant;
|
|
19
|
+
deletable?: boolean;
|
|
20
|
+
onDelete?: () => void;
|
|
21
|
+
onPress?: () => void;
|
|
22
|
+
startIcon?: React.ReactNode;
|
|
23
|
+
disabled?: boolean;
|
|
24
|
+
selected?: boolean;
|
|
25
|
+
style?: ViewStyle;
|
|
26
|
+
}
|
|
27
|
+
export declare const Chip: React.FC<ChipProps>;
|
|
28
|
+
export default Chip;
|
|
29
|
+
//# sourceMappingURL=Chip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAqC,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGjF,MAAM,MAAM,QAAQ,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AACvC,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAC;AAEzG,MAAM,WAAW,SAAS;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAkEpC,CAAC;AAUF,eAAe,IAAI,CAAC"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { View, Text, Pressable, StyleSheet } from 'react-native';
|
|
3
|
+
import { useTheme } from '../../theme/useTheme';
|
|
4
|
+
export const Chip = ({ label, size = 'm', variant = 'default', deletable = false, onDelete, onPress, startIcon, disabled = false, selected = false, style, }) => {
|
|
5
|
+
const { theme } = useTheme();
|
|
6
|
+
const aliases = theme.color.aliases ?? {};
|
|
7
|
+
const feedback = aliases.feedback ?? {};
|
|
8
|
+
const padding = theme.spacing.aliases?.padding ?? {};
|
|
9
|
+
const fontSize = theme.typography.foundation?.fontSize ?? {};
|
|
10
|
+
const disabledOpacity = theme.opacity.foundation?.[40] ?? 0.4;
|
|
11
|
+
const sizeConfig = {
|
|
12
|
+
s: { height: 24, fontSize: fontSize.xs ?? 12 - 1, paddingH: padding.s ?? 8, gap: padding.xxs ?? 2 },
|
|
13
|
+
m: { height: 32, fontSize: fontSize.xs ?? 12, paddingH: padding.m ?? 12, gap: padding.xs ?? 4 },
|
|
14
|
+
l: { height: 40, fontSize: fontSize.s ?? 14, paddingH: padding.l ?? 20, gap: padding.s ?? 8 },
|
|
15
|
+
}[size];
|
|
16
|
+
const variantStyles = (() => {
|
|
17
|
+
const colors = {
|
|
18
|
+
default: { bg: aliases.surface?.['layer-2'] ?? '#E8EEF2', text: aliases.text?.primary ?? '#17191A', border: 'transparent' },
|
|
19
|
+
primary: { bg: (aliases.brand?.primary ?? '#006FFF') + '15', text: aliases.brand?.primary ?? '#006FFF', border: 'transparent' },
|
|
20
|
+
success: { bg: feedback.success?.bg ?? '#F0FDF5', text: feedback.success?.fg ?? '#16A34A', border: 'transparent' },
|
|
21
|
+
warning: { bg: feedback.warning?.bg ?? '#FFFFE7', text: feedback.warning?.fg ?? '#D1B400', border: 'transparent' },
|
|
22
|
+
danger: { bg: feedback.error?.bg ?? '#FEF2F2', text: feedback.error?.fg ?? '#DC2626', border: 'transparent' },
|
|
23
|
+
info: { bg: feedback.info?.bg ?? '#EDF9FF', text: feedback.info?.fg ?? '#0683FF', border: 'transparent' },
|
|
24
|
+
outlined: { bg: 'transparent', text: aliases.text?.primary ?? '#17191A', border: aliases.border?.base ?? '#E8EEF2' },
|
|
25
|
+
};
|
|
26
|
+
return colors[variant] || colors.default;
|
|
27
|
+
})();
|
|
28
|
+
const chipContent = (_jsxs(View, { style: [
|
|
29
|
+
styles.container,
|
|
30
|
+
{
|
|
31
|
+
height: sizeConfig.height, paddingHorizontal: sizeConfig.paddingH, gap: sizeConfig.gap,
|
|
32
|
+
borderRadius: sizeConfig.height / 2,
|
|
33
|
+
backgroundColor: selected ? (aliases.brand?.primary ?? '#006FFF') + '20' : variantStyles.bg,
|
|
34
|
+
borderWidth: 1,
|
|
35
|
+
borderColor: selected ? (aliases.brand?.primary ?? '#006FFF') : variantStyles.border,
|
|
36
|
+
},
|
|
37
|
+
disabled && { opacity: disabledOpacity }, style,
|
|
38
|
+
], children: [startIcon && _jsx(View, { children: startIcon }), _jsx(Text, { style: [styles.label, {
|
|
39
|
+
fontSize: sizeConfig.fontSize,
|
|
40
|
+
color: selected ? (aliases.brand?.primary ?? '#006FFF') : variantStyles.text,
|
|
41
|
+
}], children: label }), deletable && (_jsx(Pressable, { onPress: () => !disabled && onDelete?.(), hitSlop: 8, accessibilityRole: "button", accessibilityLabel: `${label} 삭제`, children: _jsx(Text, { style: [styles.deleteButton, { fontSize: sizeConfig.fontSize, color: variantStyles.text }], children: "\u2715" }) }))] }));
|
|
42
|
+
if (onPress) {
|
|
43
|
+
return (_jsx(Pressable, { onPress: onPress, disabled: disabled, accessibilityRole: "button", style: ({ pressed }) => pressed ? { opacity: 0.7 } : undefined, children: chipContent }));
|
|
44
|
+
}
|
|
45
|
+
return chipContent;
|
|
46
|
+
};
|
|
47
|
+
Chip.displayName = 'Chip';
|
|
48
|
+
const styles = StyleSheet.create({
|
|
49
|
+
container: { flexDirection: 'row', alignItems: 'center', alignSelf: 'flex-start' },
|
|
50
|
+
label: { fontWeight: '500' },
|
|
51
|
+
deleteButton: { fontWeight: '600', opacity: 0.6 },
|
|
52
|
+
});
|
|
53
|
+
export default Chip;
|
|
54
|
+
//# sourceMappingURL=Chip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Divider 컴포넌트 (React Native)
|
|
3
|
+
*
|
|
4
|
+
* 스타일링 토큰 경로:
|
|
5
|
+
* - 색상: theme.color.aliases.border.{base|muted}
|
|
6
|
+
* - 간격: theme.spacing.aliases.margin.*
|
|
7
|
+
*
|
|
8
|
+
* 원본: packages/ui/src/components/Divider/Divider.tsx
|
|
9
|
+
*/
|
|
10
|
+
import React from 'react';
|
|
11
|
+
import { type ViewStyle } from 'react-native';
|
|
12
|
+
export interface DividerProps {
|
|
13
|
+
orientation?: 'horizontal' | 'vertical';
|
|
14
|
+
thickness?: number;
|
|
15
|
+
color?: string;
|
|
16
|
+
length?: number;
|
|
17
|
+
margin?: number;
|
|
18
|
+
style?: ViewStyle;
|
|
19
|
+
}
|
|
20
|
+
export declare const Divider: React.FC<DividerProps>;
|
|
21
|
+
export default Divider;
|
|
22
|
+
//# sourceMappingURL=Divider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../src/components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGpD,MAAM,WAAW,YAAY;IACzB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAc1C,CAAC;AAGF,eAAe,OAAO,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { useTheme } from '../../theme/useTheme';
|
|
4
|
+
export const Divider = ({ orientation = 'horizontal', thickness, color, length, margin, style, }) => {
|
|
5
|
+
const { theme } = useTheme();
|
|
6
|
+
const borderWidth = theme.border.foundation?.width ?? {};
|
|
7
|
+
const dividerColor = color ?? theme.color.aliases?.border?.base ?? '#E8EEF2';
|
|
8
|
+
const dividerThickness = thickness ?? borderWidth[2] ?? 1;
|
|
9
|
+
const dividerStyle = orientation === 'horizontal'
|
|
10
|
+
? { height: dividerThickness, backgroundColor: dividerColor, width: '100%', marginVertical: margin }
|
|
11
|
+
: { width: dividerThickness, backgroundColor: dividerColor, height: length || '100%', marginHorizontal: margin };
|
|
12
|
+
return _jsx(View, { style: [dividerStyle, style], accessibilityRole: "none" });
|
|
13
|
+
};
|
|
14
|
+
Divider.displayName = 'Divider';
|
|
15
|
+
export default Divider;
|
|
16
|
+
//# sourceMappingURL=Divider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Divider.js","sourceRoot":"","sources":["../../../src/components/Divider/Divider.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAWhD,MAAM,CAAC,MAAM,OAAO,GAA2B,CAAC,EAC5C,WAAW,GAAG,YAAY,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,GACtE,EAAE,EAAE;IACD,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE7B,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,UAAU,EAAE,KAAK,IAAI,EAAE,CAAC;IACzD,MAAM,YAAY,GAAG,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,IAAI,SAAS,CAAC;IAC7E,MAAM,gBAAgB,GAAG,SAAS,IAAI,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAE1D,MAAM,YAAY,GAAc,WAAW,KAAK,YAAY;QACxD,CAAC,CAAC,EAAE,MAAM,EAAE,gBAAgB,EAAE,eAAe,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,EAAE;QACpG,CAAC,CAAC,EAAE,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,IAAI,MAAM,EAAE,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAErH,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAAC;AAC3E,CAAC,CAAC;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC;AAChC,eAAe,OAAO,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Divider/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Divider/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Input 컴포넌트 (React Native)
|
|
3
|
+
*
|
|
4
|
+
* 스타일링 토큰 경로:
|
|
5
|
+
* - 색상: theme.color.semantic.field.input.{bg-default|border-default|border-focus|...}
|
|
6
|
+
* - 사이즈: theme.size.semantic.input.{s|m|l}
|
|
7
|
+
* - 패딩: theme.spacing.aliases.padding.{xs|s|m}
|
|
8
|
+
* - 라운드: theme.border.semantic.radius.input.{s|m|l}
|
|
9
|
+
* - 폰트: theme.typography.foundation.fontSize.{xs|s|base|l}
|
|
10
|
+
*
|
|
11
|
+
* 원본: packages/ui/src/components/Input/Input.tsx
|
|
12
|
+
*/
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { type ViewStyle, type TextStyle, type TextInputProps as RNTextInputProps } from 'react-native';
|
|
15
|
+
export type InputSize = 's' | 'm' | 'l';
|
|
16
|
+
export interface InputProps extends Omit<RNTextInputProps, 'style'> {
|
|
17
|
+
label?: string;
|
|
18
|
+
size?: InputSize;
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
required?: boolean;
|
|
21
|
+
error?: boolean;
|
|
22
|
+
errorMessage?: string;
|
|
23
|
+
helperText?: string;
|
|
24
|
+
startIcon?: React.ReactNode;
|
|
25
|
+
endIcon?: React.ReactNode;
|
|
26
|
+
fullWidth?: boolean;
|
|
27
|
+
containerStyle?: ViewStyle;
|
|
28
|
+
inputStyle?: TextStyle;
|
|
29
|
+
onChangeText?: (text: string) => void;
|
|
30
|
+
}
|
|
31
|
+
export declare const Input: React.FC<InputProps>;
|
|
32
|
+
export default Input;
|
|
33
|
+
//# sourceMappingURL=Input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAKH,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,cAAc,IAAI,gBAAgB,EAC1C,MAAM,cAAc,CAAC;AAGtB,MAAM,MAAM,SAAS,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAExC,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA6ItC,CAAC;AAcF,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
* Input 컴포넌트 (React Native)
|
|
4
|
+
*
|
|
5
|
+
* 스타일링 토큰 경로:
|
|
6
|
+
* - 색상: theme.color.semantic.field.input.{bg-default|border-default|border-focus|...}
|
|
7
|
+
* - 사이즈: theme.size.semantic.input.{s|m|l}
|
|
8
|
+
* - 패딩: theme.spacing.aliases.padding.{xs|s|m}
|
|
9
|
+
* - 라운드: theme.border.semantic.radius.input.{s|m|l}
|
|
10
|
+
* - 폰트: theme.typography.foundation.fontSize.{xs|s|base|l}
|
|
11
|
+
*
|
|
12
|
+
* 원본: packages/ui/src/components/Input/Input.tsx
|
|
13
|
+
*/
|
|
14
|
+
import { useState } from 'react';
|
|
15
|
+
import { View, TextInput, Text, StyleSheet, } from 'react-native';
|
|
16
|
+
import { useTheme } from '../../theme/useTheme';
|
|
17
|
+
export const Input = ({ label, size = 'm', disabled = false, required = false, error = false, errorMessage, helperText, startIcon, endIcon, fullWidth = true, containerStyle, inputStyle, onChangeText, onFocus, onBlur, ...props }) => {
|
|
18
|
+
const { theme } = useTheme();
|
|
19
|
+
const [isFocused, setIsFocused] = useState(false);
|
|
20
|
+
// ─── 토큰에서 가져오기 ───
|
|
21
|
+
const fieldTokens = theme.color.semantic?.field?.input ?? {};
|
|
22
|
+
const aliases = theme.color.aliases;
|
|
23
|
+
const inputSizeTokens = theme.size.semantic?.input;
|
|
24
|
+
const padding = theme.spacing.aliases?.padding ?? theme.spacing.aliases?.scale;
|
|
25
|
+
const fontSize = theme.typography.foundation?.fontSize;
|
|
26
|
+
const radiusTokens = theme.border.semantic?.radius?.input;
|
|
27
|
+
const disabledOpacity = theme.opacity.foundation?.[40] ?? 0.4;
|
|
28
|
+
const sizeConfig = {
|
|
29
|
+
s: {
|
|
30
|
+
height: inputSizeTokens?.s ?? 24,
|
|
31
|
+
fontSize: fontSize?.xs ?? 12,
|
|
32
|
+
paddingH: padding?.xs ?? 4,
|
|
33
|
+
},
|
|
34
|
+
m: {
|
|
35
|
+
height: inputSizeTokens?.m ?? 32,
|
|
36
|
+
fontSize: fontSize?.s ?? 14,
|
|
37
|
+
paddingH: padding?.s ?? 8,
|
|
38
|
+
},
|
|
39
|
+
l: {
|
|
40
|
+
height: inputSizeTokens?.l ?? 40,
|
|
41
|
+
fontSize: fontSize?.base ?? 16,
|
|
42
|
+
paddingH: padding?.m ?? 12,
|
|
43
|
+
},
|
|
44
|
+
}[size];
|
|
45
|
+
const borderRadius = radiusTokens?.[size] ?? 8;
|
|
46
|
+
// 색상 (semantic 토큰 > aliases 폴백)
|
|
47
|
+
const bgColor = disabled
|
|
48
|
+
? (fieldTokens['bg-disabled'] ?? aliases?.surface?.muted ?? '#E8EEF2')
|
|
49
|
+
: (fieldTokens['bg-default'] ?? aliases?.surface?.base ?? '#FFFFFF');
|
|
50
|
+
const borderColor = error
|
|
51
|
+
? (fieldTokens['border-error'] ?? aliases?.feedback?.error?.fg ?? '#DC2626')
|
|
52
|
+
: isFocused
|
|
53
|
+
? (fieldTokens['border-focus'] ?? aliases?.brand?.primary ?? '#006FFF')
|
|
54
|
+
: (fieldTokens['border-default'] ?? aliases?.border?.base ?? '#E8EEF2');
|
|
55
|
+
const textColor = disabled
|
|
56
|
+
? (fieldTokens['text-disabled'] ?? aliases?.text?.disabled ?? '#A4ADB2')
|
|
57
|
+
: (fieldTokens['text-default'] ?? aliases?.text?.primary ?? '#17191A');
|
|
58
|
+
const placeholderColor = fieldTokens?.placeholder ?? aliases?.text?.tertiary ?? '#757B80';
|
|
59
|
+
const labelColor = error
|
|
60
|
+
? (aliases?.feedback?.error?.fg ?? '#DC2626')
|
|
61
|
+
: (aliases?.text?.primary ?? '#17191A');
|
|
62
|
+
return (_jsxs(View, { style: [fullWidth && styles.fullWidth, containerStyle], children: [label && (_jsxs(Text, { style: [
|
|
63
|
+
styles.label,
|
|
64
|
+
{ color: labelColor, fontSize: fontSize?.xs ?? 12 },
|
|
65
|
+
disabled && { opacity: disabledOpacity },
|
|
66
|
+
], children: [label, required && _jsx(Text, { style: { color: aliases?.feedback?.error?.fg ?? '#DC2626' }, children: " *" })] })), _jsxs(View, { style: [
|
|
67
|
+
styles.inputWrapper,
|
|
68
|
+
{
|
|
69
|
+
height: sizeConfig.height,
|
|
70
|
+
borderColor,
|
|
71
|
+
borderRadius,
|
|
72
|
+
backgroundColor: bgColor,
|
|
73
|
+
},
|
|
74
|
+
isFocused && !error && { borderWidth: 2 },
|
|
75
|
+
], children: [startIcon && (_jsx(View, { style: [styles.iconContainer, { paddingLeft: sizeConfig.paddingH }], children: startIcon })), _jsx(TextInput, { ...props, onChangeText: onChangeText, editable: !disabled, onFocus: (e) => { setIsFocused(true); onFocus?.(e); }, onBlur: (e) => { setIsFocused(false); onBlur?.(e); }, placeholderTextColor: placeholderColor, style: [
|
|
76
|
+
styles.input,
|
|
77
|
+
{
|
|
78
|
+
fontSize: sizeConfig.fontSize,
|
|
79
|
+
color: textColor,
|
|
80
|
+
paddingHorizontal: sizeConfig.paddingH,
|
|
81
|
+
},
|
|
82
|
+
startIcon ? { paddingLeft: 0 } : null,
|
|
83
|
+
endIcon ? { paddingRight: 0 } : null,
|
|
84
|
+
inputStyle,
|
|
85
|
+
], accessibilityLabel: label, accessibilityState: { disabled } }), endIcon && (_jsx(View, { style: [styles.iconContainer, { paddingRight: sizeConfig.paddingH }], children: endIcon }))] }), helperText && !error && (_jsx(Text, { style: [styles.helperText, { color: aliases?.text?.tertiary ?? '#757B80', fontSize: fontSize?.xs ?? 12 }], children: helperText })), error && errorMessage && (_jsx(Text, { style: [styles.errorText, { color: aliases?.feedback?.error?.fg ?? '#DC2626', fontSize: fontSize?.xs ?? 12 }], children: errorMessage }))] }));
|
|
86
|
+
};
|
|
87
|
+
Input.displayName = 'Input';
|
|
88
|
+
const styles = StyleSheet.create({
|
|
89
|
+
fullWidth: { width: '100%' },
|
|
90
|
+
label: { fontWeight: '500', marginBottom: 6 },
|
|
91
|
+
inputWrapper: { flexDirection: 'row', alignItems: 'center', borderWidth: 1, overflow: 'hidden' },
|
|
92
|
+
input: { flex: 1, height: '100%', padding: 0 },
|
|
93
|
+
iconContainer: { alignItems: 'center', justifyContent: 'center', paddingHorizontal: 8 },
|
|
94
|
+
helperText: { marginTop: 4 },
|
|
95
|
+
errorText: { marginTop: 4 },
|
|
96
|
+
});
|
|
97
|
+
export default Input;
|
|
98
|
+
//# sourceMappingURL=Input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Modal 컴포넌트 (React Native)
|
|
3
|
+
*
|
|
4
|
+
* 스타일링 토큰 경로:
|
|
5
|
+
* - 배경: theme.color.aliases.surface.base
|
|
6
|
+
* - 오버레이: theme.color.aliases.overlay.base
|
|
7
|
+
* - 라운드: theme.border.semantic.radius.modal.{s|m|l}
|
|
8
|
+
* - 패딩: theme.spacing.aliases.padding.{m|l}
|
|
9
|
+
* - 그림자: theme.shadow.foundation.xl
|
|
10
|
+
* - 폰트: theme.typography.foundation.fontSize.*
|
|
11
|
+
*/
|
|
12
|
+
import React from 'react';
|
|
13
|
+
import { type ViewStyle } from 'react-native';
|
|
14
|
+
export type ModalSize = 's' | 'm' | 'l';
|
|
15
|
+
export interface ModalProps {
|
|
16
|
+
visible: boolean;
|
|
17
|
+
onClose: () => void;
|
|
18
|
+
title?: string;
|
|
19
|
+
children: React.ReactNode;
|
|
20
|
+
size?: ModalSize;
|
|
21
|
+
closable?: boolean;
|
|
22
|
+
footer?: React.ReactNode;
|
|
23
|
+
animationType?: 'none' | 'slide' | 'fade';
|
|
24
|
+
style?: ViewStyle;
|
|
25
|
+
}
|
|
26
|
+
export declare const Modal: React.FC<ModalProps>;
|
|
27
|
+
export default Modal;
|
|
28
|
+
//# sourceMappingURL=Modal.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGH,KAAK,SAAS,EACjB,MAAM,cAAc,CAAC;AAGtB,MAAM,MAAM,SAAS,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAExC,MAAM,WAAW,UAAU;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAoEtC,CAAC;AAcF,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Modal as RNModal, View, Text, Pressable, StyleSheet, KeyboardAvoidingView, Platform, } from 'react-native';
|
|
3
|
+
import { useTheme } from '../../theme/useTheme';
|
|
4
|
+
export const Modal = ({ visible, onClose, title, children, size = 'm', closable = true, footer, animationType = 'fade', style, }) => {
|
|
5
|
+
const { theme } = useTheme();
|
|
6
|
+
const surface = theme.color.aliases?.surface ?? {};
|
|
7
|
+
const text = theme.color.aliases?.text ?? {};
|
|
8
|
+
const overlay = theme.color.aliases?.overlay ?? {};
|
|
9
|
+
const borders = theme.color.aliases?.border ?? {};
|
|
10
|
+
const padding = theme.spacing.aliases?.padding ?? {};
|
|
11
|
+
const fontSize = theme.typography.foundation?.fontSize ?? {};
|
|
12
|
+
const modalRadius = theme.border.semantic?.radius?.modal ?? {};
|
|
13
|
+
const shadow = theme.shadow.foundation ?? {};
|
|
14
|
+
const gap = theme.spacing.aliases?.gap ?? {};
|
|
15
|
+
const borderRadius = modalRadius[size] ?? { s: 8, m: 12, l: 16 }[size];
|
|
16
|
+
const maxWidth = { s: 320, m: 400, l: 500 }[size];
|
|
17
|
+
const toShadowStyle = (s) => s ? {
|
|
18
|
+
shadowColor: s.shadowColor ?? '#000',
|
|
19
|
+
shadowOffset: { width: s.shadowOffsetX ?? 0, height: s.shadowOffsetY ?? 0 },
|
|
20
|
+
shadowOpacity: s.shadowOpacity ?? 0.1,
|
|
21
|
+
shadowRadius: s.shadowRadius ?? 15,
|
|
22
|
+
elevation: s.elevation ?? 8,
|
|
23
|
+
} : {};
|
|
24
|
+
return (_jsx(RNModal, { visible: visible, transparent: true, animationType: animationType, onRequestClose: closable ? onClose : undefined, children: _jsxs(KeyboardAvoidingView, { style: styles.overlay, behavior: Platform.OS === 'ios' ? 'padding' : undefined, children: [_jsx(Pressable, { style: [styles.backdrop, { backgroundColor: overlay.base ?? 'rgba(0,0,0,0.6)' }], onPress: closable ? onClose : undefined }), _jsxs(View, { style: [
|
|
25
|
+
styles.container,
|
|
26
|
+
{
|
|
27
|
+
maxWidth, borderRadius,
|
|
28
|
+
backgroundColor: surface.base ?? '#FFFFFF',
|
|
29
|
+
padding: padding.l ?? 20,
|
|
30
|
+
...toShadowStyle(shadow.xl),
|
|
31
|
+
},
|
|
32
|
+
style,
|
|
33
|
+
], children: [(title || closable) && (_jsxs(View, { style: [styles.header, { marginBottom: gap.m ?? 12 }], children: [title && (_jsx(Text, { style: [styles.title, { color: text.primary ?? '#17191A', fontSize: fontSize.l ?? 18 }], children: title })), closable && (_jsx(Pressable, { onPress: onClose, hitSlop: 8, accessibilityLabel: "\uB2EB\uAE30", accessibilityRole: "button", children: _jsx(Text, { style: { fontSize: fontSize.xl ?? 20, color: text.tertiary ?? '#757B80' }, children: "\u2715" }) }))] })), _jsx(View, { style: styles.body, children: children }), footer && (_jsx(View, { style: [styles.footer, { borderTopColor: borders.base ?? '#E8EEF2', marginTop: gap.l ?? 20, paddingTop: gap.m ?? 12 }], children: footer }))] })] }) }));
|
|
34
|
+
};
|
|
35
|
+
Modal.displayName = 'Modal';
|
|
36
|
+
const styles = StyleSheet.create({
|
|
37
|
+
overlay: { flex: 1, justifyContent: 'center', alignItems: 'center' },
|
|
38
|
+
backdrop: { ...StyleSheet.absoluteFillObject },
|
|
39
|
+
container: { width: '90%' },
|
|
40
|
+
header: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' },
|
|
41
|
+
title: { fontWeight: '600', flex: 1 },
|
|
42
|
+
body: {},
|
|
43
|
+
footer: { flexDirection: 'row', justifyContent: 'flex-end', gap: 8, borderTopWidth: 1 },
|
|
44
|
+
});
|
|
45
|
+
export default Modal;
|
|
46
|
+
//# sourceMappingURL=Modal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Navbar 컴포넌트 (React Native)
|
|
3
|
+
*
|
|
4
|
+
* 두 가지 모드 지원:
|
|
5
|
+
* 1. stack (기본) — 왼쪽 뒤로가기, 가운데 타이틀, 오른쪽 액션 버튼(최대 2개)
|
|
6
|
+
* 2. tab — 왼쪽 타이틀 텍스트, 오른쪽 액션 버튼(최대 3개)
|
|
7
|
+
*
|
|
8
|
+
* 스타일링 토큰 경로:
|
|
9
|
+
* - 배경: theme.color.aliases.surface.base
|
|
10
|
+
* - 텍스트: theme.color.aliases.text.{primary|secondary}
|
|
11
|
+
* - 보더: theme.color.aliases.border.base
|
|
12
|
+
* - 브랜드: theme.color.aliases.brand.primary
|
|
13
|
+
* - 폰트: theme.typography.foundation.fontSize.*
|
|
14
|
+
* - 패딩: theme.spacing.aliases.padding.*
|
|
15
|
+
* - 아이콘: theme.size.semantic.icon.*
|
|
16
|
+
*/
|
|
17
|
+
import React from 'react';
|
|
18
|
+
import { type ViewStyle } from 'react-native';
|
|
19
|
+
export interface NavbarAction {
|
|
20
|
+
/** 아이콘 (ReactNode) 또는 텍스트 */
|
|
21
|
+
icon?: React.ReactNode;
|
|
22
|
+
label?: string;
|
|
23
|
+
onPress: () => void;
|
|
24
|
+
disabled?: boolean;
|
|
25
|
+
}
|
|
26
|
+
export interface NavbarProps {
|
|
27
|
+
/** 네비게이션 모드: stack = 뒤로가기+중앙타이틀, tab = 좌측타이틀+우측액션 */
|
|
28
|
+
mode?: 'stack' | 'tab';
|
|
29
|
+
/** 타이틀 */
|
|
30
|
+
title: string;
|
|
31
|
+
/** 서브타이틀 (tab 모드에서만 표시) */
|
|
32
|
+
subtitle?: string;
|
|
33
|
+
/** 뒤로가기 핸들러 (stack 모드) */
|
|
34
|
+
onBack?: () => void;
|
|
35
|
+
/** 뒤로가기 커스텀 아이콘 */
|
|
36
|
+
backIcon?: React.ReactNode;
|
|
37
|
+
/** 오른쪽 액션 버튼 (stack: 최대 2개, tab: 최대 3개) */
|
|
38
|
+
actions?: NavbarAction[];
|
|
39
|
+
/** 하단 보더 표시 여부 */
|
|
40
|
+
showBorder?: boolean;
|
|
41
|
+
/** 배경 투명 */
|
|
42
|
+
transparent?: boolean;
|
|
43
|
+
/** 타이틀 아래 추가 컨텐츠 (검색바 등) */
|
|
44
|
+
children?: React.ReactNode;
|
|
45
|
+
/** 추가 스타일 */
|
|
46
|
+
style?: ViewStyle;
|
|
47
|
+
}
|
|
48
|
+
export declare const Navbar: React.FC<NavbarProps>;
|
|
49
|
+
export default Navbar;
|
|
50
|
+
//# sourceMappingURL=Navbar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Navbar.d.ts","sourceRoot":"","sources":["../../../src/components/Navbar/Navbar.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEH,KAAK,SAAS,EACjB,MAAM,cAAc,CAAC;AAGtB,MAAM,WAAW,YAAY;IACzB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,WAAW;IACxB,qDAAqD;IACrD,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IACvB,UAAU;IACV,KAAK,EAAE,MAAM,CAAC;IACd,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,mBAAmB;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,2CAA2C;IAC3C,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,kBAAkB;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY;IACZ,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,aAAa;IACb,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAwKxC,CAAC;AAsDF,eAAe,MAAM,CAAC"}
|