@umituz/react-native-design-system 1.5.7 → 1.5.9
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/package.json +3 -8
- package/src/presentation/atoms/AtomicPicker.tsx +2 -2
- package/lib/index.d.ts +0 -61
- package/lib/index.d.ts.map +0 -1
- package/lib/index.js +0 -101
- package/lib/index.js.map +0 -1
- package/lib/presentation/atoms/AtomicAvatar.d.ts +0 -48
- package/lib/presentation/atoms/AtomicAvatar.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicAvatar.js +0 -85
- package/lib/presentation/atoms/AtomicAvatar.js.map +0 -1
- package/lib/presentation/atoms/AtomicAvatarGroup.d.ts +0 -56
- package/lib/presentation/atoms/AtomicAvatarGroup.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicAvatarGroup.js +0 -83
- package/lib/presentation/atoms/AtomicAvatarGroup.js.map +0 -1
- package/lib/presentation/atoms/AtomicBadge.d.ts +0 -42
- package/lib/presentation/atoms/AtomicBadge.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicBadge.js +0 -168
- package/lib/presentation/atoms/AtomicBadge.js.map +0 -1
- package/lib/presentation/atoms/AtomicButton.d.ts +0 -21
- package/lib/presentation/atoms/AtomicButton.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicButton.js +0 -172
- package/lib/presentation/atoms/AtomicButton.js.map +0 -1
- package/lib/presentation/atoms/AtomicCard.d.ts +0 -15
- package/lib/presentation/atoms/AtomicCard.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicCard.js +0 -70
- package/lib/presentation/atoms/AtomicCard.js.map +0 -1
- package/lib/presentation/atoms/AtomicChip.d.ts +0 -53
- package/lib/presentation/atoms/AtomicChip.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicChip.js +0 -131
- package/lib/presentation/atoms/AtomicChip.js.map +0 -1
- package/lib/presentation/atoms/AtomicDatePicker.d.ts +0 -75
- package/lib/presentation/atoms/AtomicDatePicker.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicDatePicker.js +0 -246
- package/lib/presentation/atoms/AtomicDatePicker.js.map +0 -1
- package/lib/presentation/atoms/AtomicDivider.d.ts +0 -45
- package/lib/presentation/atoms/AtomicDivider.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicDivider.js +0 -58
- package/lib/presentation/atoms/AtomicDivider.js.map +0 -1
- package/lib/presentation/atoms/AtomicFab.d.ts +0 -37
- package/lib/presentation/atoms/AtomicFab.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicFab.js +0 -68
- package/lib/presentation/atoms/AtomicFab.js.map +0 -1
- package/lib/presentation/atoms/AtomicFilter.d.ts +0 -37
- package/lib/presentation/atoms/AtomicFilter.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicFilter.js +0 -104
- package/lib/presentation/atoms/AtomicFilter.js.map +0 -1
- package/lib/presentation/atoms/AtomicFormError.d.ts +0 -30
- package/lib/presentation/atoms/AtomicFormError.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicFormError.js +0 -64
- package/lib/presentation/atoms/AtomicFormError.js.map +0 -1
- package/lib/presentation/atoms/AtomicIcon.d.ts +0 -35
- package/lib/presentation/atoms/AtomicIcon.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicIcon.js +0 -30
- package/lib/presentation/atoms/AtomicIcon.js.map +0 -1
- package/lib/presentation/atoms/AtomicImage.d.ts +0 -40
- package/lib/presentation/atoms/AtomicImage.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicImage.js +0 -92
- package/lib/presentation/atoms/AtomicImage.js.map +0 -1
- package/lib/presentation/atoms/AtomicInput.d.ts +0 -71
- package/lib/presentation/atoms/AtomicInput.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicInput.js +0 -196
- package/lib/presentation/atoms/AtomicInput.js.map +0 -1
- package/lib/presentation/atoms/AtomicNumberInput.d.ts +0 -69
- package/lib/presentation/atoms/AtomicNumberInput.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicNumberInput.js +0 -125
- package/lib/presentation/atoms/AtomicNumberInput.js.map +0 -1
- package/lib/presentation/atoms/AtomicPicker.d.ts +0 -52
- package/lib/presentation/atoms/AtomicPicker.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicPicker.js +0 -299
- package/lib/presentation/atoms/AtomicPicker.js.map +0 -1
- package/lib/presentation/atoms/AtomicProgress.d.ts +0 -44
- package/lib/presentation/atoms/AtomicProgress.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicProgress.js +0 -80
- package/lib/presentation/atoms/AtomicProgress.js.map +0 -1
- package/lib/presentation/atoms/AtomicSearchBar.d.ts +0 -19
- package/lib/presentation/atoms/AtomicSearchBar.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicSearchBar.js +0 -46
- package/lib/presentation/atoms/AtomicSearchBar.js.map +0 -1
- package/lib/presentation/atoms/AtomicSort.d.ts +0 -72
- package/lib/presentation/atoms/AtomicSort.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicSort.js +0 -77
- package/lib/presentation/atoms/AtomicSort.js.map +0 -1
- package/lib/presentation/atoms/AtomicSwitch.d.ts +0 -43
- package/lib/presentation/atoms/AtomicSwitch.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicSwitch.js +0 -104
- package/lib/presentation/atoms/AtomicSwitch.js.map +0 -1
- package/lib/presentation/atoms/AtomicText.d.ts +0 -34
- package/lib/presentation/atoms/AtomicText.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicText.js +0 -59
- package/lib/presentation/atoms/AtomicText.js.map +0 -1
- package/lib/presentation/atoms/AtomicTextArea.d.ts +0 -85
- package/lib/presentation/atoms/AtomicTextArea.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicTextArea.js +0 -196
- package/lib/presentation/atoms/AtomicTextArea.js.map +0 -1
- package/lib/presentation/atoms/AtomicTouchable.d.ts +0 -77
- package/lib/presentation/atoms/AtomicTouchable.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicTouchable.js +0 -138
- package/lib/presentation/atoms/AtomicTouchable.js.map +0 -1
- package/lib/presentation/atoms/fab/styles/fabStyles.d.ts +0 -23
- package/lib/presentation/atoms/fab/styles/fabStyles.d.ts.map +0 -1
- package/lib/presentation/atoms/fab/styles/fabStyles.js +0 -63
- package/lib/presentation/atoms/fab/styles/fabStyles.js.map +0 -1
- package/lib/presentation/atoms/fab/types/index.d.ts +0 -71
- package/lib/presentation/atoms/fab/types/index.d.ts.map +0 -1
- package/lib/presentation/atoms/fab/types/index.js +0 -2
- package/lib/presentation/atoms/fab/types/index.js.map +0 -1
- package/lib/presentation/atoms/filter/styles/filterStyles.d.ts +0 -15
- package/lib/presentation/atoms/filter/styles/filterStyles.d.ts.map +0 -1
- package/lib/presentation/atoms/filter/styles/filterStyles.js +0 -29
- package/lib/presentation/atoms/filter/styles/filterStyles.js.map +0 -1
- package/lib/presentation/atoms/filter/types/index.d.ts +0 -76
- package/lib/presentation/atoms/filter/types/index.d.ts.map +0 -1
- package/lib/presentation/atoms/filter/types/index.js +0 -2
- package/lib/presentation/atoms/filter/types/index.js.map +0 -1
- package/lib/presentation/atoms/index.d.ts +0 -273
- package/lib/presentation/atoms/index.d.ts.map +0 -1
- package/lib/presentation/atoms/index.js +0 -146
- package/lib/presentation/atoms/index.js.map +0 -1
- package/lib/presentation/atoms/input/hooks/useInputState.d.ts +0 -7
- package/lib/presentation/atoms/input/hooks/useInputState.d.ts.map +0 -1
- package/lib/presentation/atoms/input/hooks/useInputState.js +0 -13
- package/lib/presentation/atoms/input/hooks/useInputState.js.map +0 -1
- package/lib/presentation/atoms/input/styles/inputStyles.d.ts +0 -13
- package/lib/presentation/atoms/input/styles/inputStyles.d.ts.map +0 -1
- package/lib/presentation/atoms/input/styles/inputStyles.js +0 -59
- package/lib/presentation/atoms/input/styles/inputStyles.js.map +0 -1
- package/lib/presentation/atoms/input/types/index.d.ts +0 -24
- package/lib/presentation/atoms/input/types/index.d.ts.map +0 -1
- package/lib/presentation/atoms/input/types/index.js +0 -2
- package/lib/presentation/atoms/input/types/index.js.map +0 -1
- package/lib/presentation/atoms/picker/styles/pickerStyles.d.ts +0 -85
- package/lib/presentation/atoms/picker/styles/pickerStyles.d.ts.map +0 -1
- package/lib/presentation/atoms/picker/styles/pickerStyles.js +0 -177
- package/lib/presentation/atoms/picker/styles/pickerStyles.js.map +0 -1
- package/lib/presentation/atoms/picker/types/index.d.ts +0 -38
- package/lib/presentation/atoms/picker/types/index.d.ts.map +0 -1
- package/lib/presentation/atoms/picker/types/index.js +0 -2
- package/lib/presentation/atoms/picker/types/index.js.map +0 -1
- package/lib/presentation/atoms/touchable/styles/touchableStyles.d.ts +0 -31
- package/lib/presentation/atoms/touchable/styles/touchableStyles.d.ts.map +0 -1
- package/lib/presentation/atoms/touchable/styles/touchableStyles.js +0 -54
- package/lib/presentation/atoms/touchable/styles/touchableStyles.js.map +0 -1
- package/lib/presentation/atoms/touchable/types/index.d.ts +0 -134
- package/lib/presentation/atoms/touchable/types/index.d.ts.map +0 -1
- package/lib/presentation/atoms/touchable/types/index.js +0 -2
- package/lib/presentation/atoms/touchable/types/index.js.map +0 -1
- package/lib/presentation/hooks/useResponsive.d.ts +0 -80
- package/lib/presentation/hooks/useResponsive.d.ts.map +0 -1
- package/lib/presentation/hooks/useResponsive.js +0 -82
- package/lib/presentation/hooks/useResponsive.js.map +0 -1
- package/lib/presentation/molecules/AtomicConfirmationModal.d.ts +0 -73
- package/lib/presentation/molecules/AtomicConfirmationModal.d.ts.map +0 -1
- package/lib/presentation/molecules/AtomicConfirmationModal.js +0 -154
- package/lib/presentation/molecules/AtomicConfirmationModal.js.map +0 -1
- package/lib/presentation/molecules/EmptyState.d.ts +0 -41
- package/lib/presentation/molecules/EmptyState.d.ts.map +0 -1
- package/lib/presentation/molecules/EmptyState.js +0 -68
- package/lib/presentation/molecules/EmptyState.js.map +0 -1
- package/lib/presentation/molecules/FormField.d.ts +0 -22
- package/lib/presentation/molecules/FormField.d.ts.map +0 -1
- package/lib/presentation/molecules/FormField.js +0 -76
- package/lib/presentation/molecules/FormField.js.map +0 -1
- package/lib/presentation/molecules/GridContainer.d.ts +0 -40
- package/lib/presentation/molecules/GridContainer.d.ts.map +0 -1
- package/lib/presentation/molecules/GridContainer.js +0 -77
- package/lib/presentation/molecules/GridContainer.js.map +0 -1
- package/lib/presentation/molecules/IconContainer.d.ts +0 -29
- package/lib/presentation/molecules/IconContainer.d.ts.map +0 -1
- package/lib/presentation/molecules/IconContainer.js +0 -60
- package/lib/presentation/molecules/IconContainer.js.map +0 -1
- package/lib/presentation/molecules/ListItem.d.ts +0 -5
- package/lib/presentation/molecules/ListItem.d.ts.map +0 -1
- package/lib/presentation/molecules/ListItem.js +0 -24
- package/lib/presentation/molecules/ListItem.js.map +0 -1
- package/lib/presentation/molecules/ScreenHeader.d.ts +0 -55
- package/lib/presentation/molecules/ScreenHeader.d.ts.map +0 -1
- package/lib/presentation/molecules/ScreenHeader.js +0 -94
- package/lib/presentation/molecules/ScreenHeader.js.map +0 -1
- package/lib/presentation/molecules/SearchBar.d.ts +0 -18
- package/lib/presentation/molecules/SearchBar.d.ts.map +0 -1
- package/lib/presentation/molecules/SearchBar.js +0 -47
- package/lib/presentation/molecules/SearchBar.js.map +0 -1
- package/lib/presentation/molecules/SectionCard.d.ts +0 -25
- package/lib/presentation/molecules/SectionCard.d.ts.map +0 -1
- package/lib/presentation/molecules/SectionCard.js +0 -47
- package/lib/presentation/molecules/SectionCard.js.map +0 -1
- package/lib/presentation/molecules/SectionContainer.d.ts +0 -33
- package/lib/presentation/molecules/SectionContainer.d.ts.map +0 -1
- package/lib/presentation/molecules/SectionContainer.js +0 -64
- package/lib/presentation/molecules/SectionContainer.js.map +0 -1
- package/lib/presentation/molecules/SectionHeader.d.ts +0 -37
- package/lib/presentation/molecules/SectionHeader.d.ts.map +0 -1
- package/lib/presentation/molecules/SectionHeader.js +0 -73
- package/lib/presentation/molecules/SectionHeader.js.map +0 -1
- package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.d.ts +0 -50
- package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.d.ts.map +0 -1
- package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.js +0 -115
- package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.js.map +0 -1
- package/lib/presentation/molecules/confirmation-modal/types/index.d.ts +0 -86
- package/lib/presentation/molecules/confirmation-modal/types/index.d.ts.map +0 -1
- package/lib/presentation/molecules/confirmation-modal/types/index.js +0 -7
- package/lib/presentation/molecules/confirmation-modal/types/index.js.map +0 -1
- package/lib/presentation/molecules/index.d.ts +0 -27
- package/lib/presentation/molecules/index.d.ts.map +0 -1
- package/lib/presentation/molecules/index.js +0 -17
- package/lib/presentation/molecules/index.js.map +0 -1
- package/lib/presentation/molecules/listitem/styles/listItemStyles.d.ts +0 -12
- package/lib/presentation/molecules/listitem/styles/listItemStyles.d.ts.map +0 -1
- package/lib/presentation/molecules/listitem/styles/listItemStyles.js +0 -15
- package/lib/presentation/molecules/listitem/styles/listItemStyles.js.map +0 -1
- package/lib/presentation/molecules/listitem/types/index.d.ts +0 -17
- package/lib/presentation/molecules/listitem/types/index.d.ts.map +0 -1
- package/lib/presentation/molecules/listitem/types/index.js +0 -2
- package/lib/presentation/molecules/listitem/types/index.js.map +0 -1
- package/lib/presentation/organisms/AppHeader.d.ts +0 -31
- package/lib/presentation/organisms/AppHeader.d.ts.map +0 -1
- package/lib/presentation/organisms/AppHeader.js +0 -78
- package/lib/presentation/organisms/AppHeader.js.map +0 -1
- package/lib/presentation/organisms/FormContainer.d.ts +0 -76
- package/lib/presentation/organisms/FormContainer.d.ts.map +0 -1
- package/lib/presentation/organisms/FormContainer.js +0 -127
- package/lib/presentation/organisms/FormContainer.js.map +0 -1
- package/lib/presentation/organisms/ScreenLayout.d.ts +0 -84
- package/lib/presentation/organisms/ScreenLayout.d.ts.map +0 -1
- package/lib/presentation/organisms/ScreenLayout.js +0 -69
- package/lib/presentation/organisms/ScreenLayout.js.map +0 -1
- package/lib/presentation/organisms/index.d.ts +0 -16
- package/lib/presentation/organisms/index.d.ts.map +0 -1
- package/lib/presentation/organisms/index.js +0 -14
- package/lib/presentation/organisms/index.js.map +0 -1
- package/lib/presentation/tokens/commonStyles.d.ts +0 -122
- package/lib/presentation/tokens/commonStyles.d.ts.map +0 -1
- package/lib/presentation/tokens/commonStyles.js +0 -220
- package/lib/presentation/tokens/commonStyles.js.map +0 -1
- package/lib/presentation/utils/platformConstants.d.ts +0 -100
- package/lib/presentation/utils/platformConstants.d.ts.map +0 -1
- package/lib/presentation/utils/platformConstants.js +0 -114
- package/lib/presentation/utils/platformConstants.js.map +0 -1
- package/lib/presentation/utils/responsive.d.ts +0 -218
- package/lib/presentation/utils/responsive.d.ts.map +0 -1
- package/lib/presentation/utils/responsive.js +0 -452
- package/lib/presentation/utils/responsive.js.map +0 -1
- package/lib/presentation/utils/variants/compound.d.ts +0 -10
- package/lib/presentation/utils/variants/compound.d.ts.map +0 -1
- package/lib/presentation/utils/variants/compound.js +0 -16
- package/lib/presentation/utils/variants/compound.js.map +0 -1
- package/lib/presentation/utils/variants/core.d.ts +0 -15
- package/lib/presentation/utils/variants/core.d.ts.map +0 -1
- package/lib/presentation/utils/variants/core.js +0 -23
- package/lib/presentation/utils/variants/core.js.map +0 -1
- package/lib/presentation/utils/variants/helpers.d.ts +0 -5
- package/lib/presentation/utils/variants/helpers.d.ts.map +0 -1
- package/lib/presentation/utils/variants/helpers.js +0 -10
- package/lib/presentation/utils/variants/helpers.js.map +0 -1
- package/lib/presentation/utils/variants.d.ts +0 -4
- package/lib/presentation/utils/variants.d.ts.map +0 -1
- package/lib/presentation/utils/variants.js +0 -4
- package/lib/presentation/utils/variants.js.map +0 -1
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ScrollView, View, TouchableOpacity } from 'react-native';
|
|
3
|
-
import { useAppDesignTokens } from '@umituz/react-native-theme';
|
|
4
|
-
import { AtomicChip } from './AtomicChip';
|
|
5
|
-
import { AtomicText } from './AtomicText';
|
|
6
|
-
import { AtomicIcon } from './AtomicIcon';
|
|
7
|
-
import { getFilterContainerStyle, getClearAllContainerStyle, getScrollContentContainerStyle, } from './filter/styles/filterStyles';
|
|
8
|
-
export { getFilterContainerStyle, getClearAllContainerStyle, getScrollContentContainerStyle, } from './filter/styles/filterStyles';
|
|
9
|
-
/**
|
|
10
|
-
* AtomicFilter - Horizontal Filter Chip Component
|
|
11
|
-
*
|
|
12
|
-
* A Material Design 3 compliant filter component using chip selection.
|
|
13
|
-
* Supports single and multi-select modes with "Clear All" functionality.
|
|
14
|
-
*
|
|
15
|
-
* @example
|
|
16
|
-
* ```tsx
|
|
17
|
-
* const [selectedFilters, setSelectedFilters] = useState<string[]>([]);
|
|
18
|
-
*
|
|
19
|
-
* <AtomicFilter
|
|
20
|
-
* options={[
|
|
21
|
-
* { id: 'active', label: 'Active', icon: 'check-circle' },
|
|
22
|
-
* { id: 'completed', label: 'Completed', icon: 'check' },
|
|
23
|
-
* { id: 'pending', label: 'Pending', icon: 'clock' },
|
|
24
|
-
* ]}
|
|
25
|
-
* selectedIds={selectedFilters}
|
|
26
|
-
* onSelectionChange={setSelectedFilters}
|
|
27
|
-
* multiSelect={true}
|
|
28
|
-
* showClearAll={true}
|
|
29
|
-
* />
|
|
30
|
-
* ```
|
|
31
|
-
*
|
|
32
|
-
* Features:
|
|
33
|
-
* - Horizontal scrollable filter chips
|
|
34
|
-
* - Single/Multi-select modes
|
|
35
|
-
* - Clear all button (when filters active)
|
|
36
|
-
* - Theme-aware colors from design tokens
|
|
37
|
-
* - Icon support per filter option
|
|
38
|
-
* - Fully controlled component
|
|
39
|
-
*/
|
|
40
|
-
export const AtomicFilter = ({ options, selectedIds, onSelectionChange, multiSelect = true, showClearAll = true, variant = 'outlined', color = 'primary', size = 'md', style, testID, }) => {
|
|
41
|
-
const tokens = useAppDesignTokens();
|
|
42
|
-
/**
|
|
43
|
-
* Handle filter chip press
|
|
44
|
-
*/
|
|
45
|
-
const handleFilterPress = (optionId) => {
|
|
46
|
-
if (multiSelect) {
|
|
47
|
-
// Multi-select mode: Toggle selection
|
|
48
|
-
if (selectedIds.includes(optionId)) {
|
|
49
|
-
// Deselect
|
|
50
|
-
onSelectionChange(selectedIds.filter(id => id !== optionId));
|
|
51
|
-
}
|
|
52
|
-
else {
|
|
53
|
-
// Select
|
|
54
|
-
onSelectionChange([...selectedIds, optionId]);
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
else {
|
|
58
|
-
// Single-select mode: Replace selection
|
|
59
|
-
if (selectedIds.includes(optionId)) {
|
|
60
|
-
// Deselect (clear selection)
|
|
61
|
-
onSelectionChange([]);
|
|
62
|
-
}
|
|
63
|
-
else {
|
|
64
|
-
// Select (only this one)
|
|
65
|
-
onSelectionChange([optionId]);
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
};
|
|
69
|
-
/**
|
|
70
|
-
* Handle clear all button press
|
|
71
|
-
*/
|
|
72
|
-
const handleClearAll = () => {
|
|
73
|
-
onSelectionChange([]);
|
|
74
|
-
};
|
|
75
|
-
const hasActiveFilters = selectedIds.length > 0;
|
|
76
|
-
return (<ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={getScrollContentContainerStyle()} style={[style]} testID={testID}>
|
|
77
|
-
<View style={getFilterContainerStyle()}>
|
|
78
|
-
{options.map((option) => {
|
|
79
|
-
const isSelected = selectedIds.includes(option.id);
|
|
80
|
-
return (<AtomicChip key={option.id} variant={isSelected ? 'filled' : variant} color={color} size={size} leadingIcon={option.icon} selected={isSelected} clickable={true} onPress={() => handleFilterPress(option.id)} testID={`filter-chip-${option.id}`}>
|
|
81
|
-
{option.label}
|
|
82
|
-
</AtomicChip>);
|
|
83
|
-
})}
|
|
84
|
-
|
|
85
|
-
{/* Clear All Button */}
|
|
86
|
-
{showClearAll && hasActiveFilters && (<TouchableOpacity onPress={handleClearAll} style={[
|
|
87
|
-
getClearAllContainerStyle(),
|
|
88
|
-
{
|
|
89
|
-
backgroundColor: tokens.colors.surfaceVariant,
|
|
90
|
-
borderWidth: 1,
|
|
91
|
-
borderColor: tokens.colors.outline,
|
|
92
|
-
}
|
|
93
|
-
]} testID="clear-all-button">
|
|
94
|
-
<View style={{ flexDirection: 'row', alignItems: 'center', gap: tokens.spacing.xs }}>
|
|
95
|
-
<AtomicIcon name="X" size="xs" color="surfaceVariant"/>
|
|
96
|
-
<AtomicText type="labelSmall" style={{ color: tokens.colors.textSecondary }}>
|
|
97
|
-
Clear All
|
|
98
|
-
</AtomicText>
|
|
99
|
-
</View>
|
|
100
|
-
</TouchableOpacity>)}
|
|
101
|
-
</View>
|
|
102
|
-
</ScrollView>);
|
|
103
|
-
};
|
|
104
|
-
//# sourceMappingURL=AtomicFilter.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicFilter.js","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicFilter.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* AtomicFormError - Universal Form Error Component
|
|
3
|
-
*
|
|
4
|
-
* Provides consistent error message display for forms
|
|
5
|
-
* Theme: {{THEME_NAME}} ({{CATEGORY}} category)
|
|
6
|
-
*
|
|
7
|
-
* Atomic Design Level: ATOM
|
|
8
|
-
* Purpose: Display validation error messages
|
|
9
|
-
*
|
|
10
|
-
* Usage:
|
|
11
|
-
* - Form field validation errors
|
|
12
|
-
* - Global form error messages
|
|
13
|
-
* - API error display
|
|
14
|
-
* - Input validation feedback
|
|
15
|
-
*/
|
|
16
|
-
import React from 'react';
|
|
17
|
-
import { StyleProp, ViewStyle, TextStyle } from 'react-native';
|
|
18
|
-
export interface AtomicFormErrorProps {
|
|
19
|
-
/** Error message to display */
|
|
20
|
-
message: string | null | undefined;
|
|
21
|
-
/** Error display variant */
|
|
22
|
-
variant?: 'global' | 'field';
|
|
23
|
-
/** Custom container style */
|
|
24
|
-
style?: StyleProp<ViewStyle>;
|
|
25
|
-
/** Custom text style */
|
|
26
|
-
textStyle?: StyleProp<TextStyle>;
|
|
27
|
-
}
|
|
28
|
-
export declare const AtomicFormError: React.FC<AtomicFormErrorProps>;
|
|
29
|
-
export default AtomicFormError;
|
|
30
|
-
//# sourceMappingURL=AtomicFormError.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicFormError.d.ts","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicFormError.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAoB,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AASjF,MAAM,WAAW,oBAAoB;IACnC,+BAA+B;IAC/B,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACnC,4BAA4B;IAC5B,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC7B,6BAA6B;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,wBAAwB;IACxB,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAClC;AAMD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyD1D,CAAC;AAMF,eAAe,eAAe,CAAC"}
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* AtomicFormError - Universal Form Error Component
|
|
3
|
-
*
|
|
4
|
-
* Provides consistent error message display for forms
|
|
5
|
-
* Theme: {{THEME_NAME}} ({{CATEGORY}} category)
|
|
6
|
-
*
|
|
7
|
-
* Atomic Design Level: ATOM
|
|
8
|
-
* Purpose: Display validation error messages
|
|
9
|
-
*
|
|
10
|
-
* Usage:
|
|
11
|
-
* - Form field validation errors
|
|
12
|
-
* - Global form error messages
|
|
13
|
-
* - API error display
|
|
14
|
-
* - Input validation feedback
|
|
15
|
-
*/
|
|
16
|
-
import React from 'react';
|
|
17
|
-
import { View, StyleSheet } from 'react-native';
|
|
18
|
-
import { AtomicText } from './AtomicText';
|
|
19
|
-
import { useAppDesignTokens } from '@umituz/react-native-theme';
|
|
20
|
-
import { withAlpha } from '@umituz/react-native-theme';
|
|
21
|
-
// =============================================================================
|
|
22
|
-
// COMPONENT IMPLEMENTATION
|
|
23
|
-
// =============================================================================
|
|
24
|
-
export const AtomicFormError = ({ message, variant = 'field', style, textStyle, }) => {
|
|
25
|
-
const tokens = useAppDesignTokens();
|
|
26
|
-
if (!message) {
|
|
27
|
-
return null;
|
|
28
|
-
}
|
|
29
|
-
if (variant === 'global') {
|
|
30
|
-
return (<View style={[
|
|
31
|
-
{
|
|
32
|
-
padding: tokens.spacing.md,
|
|
33
|
-
borderRadius: tokens.borders.radius.md,
|
|
34
|
-
marginBottom: tokens.spacing.sm,
|
|
35
|
-
backgroundColor: withAlpha(tokens.colors.error, 0.15),
|
|
36
|
-
},
|
|
37
|
-
style,
|
|
38
|
-
]}>
|
|
39
|
-
<AtomicText type="bodySmall" color="error" style={StyleSheet.flatten([
|
|
40
|
-
{
|
|
41
|
-
textAlign: 'center',
|
|
42
|
-
fontWeight: tokens.typography.medium,
|
|
43
|
-
},
|
|
44
|
-
textStyle,
|
|
45
|
-
])}>
|
|
46
|
-
{message}
|
|
47
|
-
</AtomicText>
|
|
48
|
-
</View>);
|
|
49
|
-
}
|
|
50
|
-
return (<AtomicText type="bodySmall" color="error" style={StyleSheet.flatten([
|
|
51
|
-
{
|
|
52
|
-
marginTop: tokens.spacing.xs,
|
|
53
|
-
marginLeft: tokens.spacing.xs,
|
|
54
|
-
},
|
|
55
|
-
textStyle,
|
|
56
|
-
])}>
|
|
57
|
-
{message}
|
|
58
|
-
</AtomicText>);
|
|
59
|
-
};
|
|
60
|
-
// =============================================================================
|
|
61
|
-
// EXPORTS
|
|
62
|
-
// =============================================================================
|
|
63
|
-
export default AtomicFormError;
|
|
64
|
-
//# sourceMappingURL=AtomicFormError.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicFormError.js","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicFormError.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,UAAU,EAAmC,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAiBvD,gFAAgF;AAChF,2BAA2B;AAC3B,gFAAgF;AAEhF,MAAM,CAAC,MAAM,eAAe,GAAmC,CAAC,EAC9D,OAAO,EACP,OAAO,GAAG,OAAO,EACjB,KAAK,EACL,SAAS,GACV,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IAEpC,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,OAAO,KAAK,QAAQ,EAAE,CAAC;QACzB,OAAO,CACL,CAAC,IAAI,CACH,KAAK,CAAC,CAAC;gBACL;oBACE,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;oBAC1B,YAAY,EAAE,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;oBACtC,YAAY,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;oBAC/B,eAAe,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC;iBACtD;gBACD,KAAK;aACN,CAAC,CAEF;QAAA,CAAC,UAAU,CACT,IAAI,CAAC,WAAW,CAChB,KAAK,CAAC,OAAO,CACb,KAAK,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC;gBACxB;oBACE,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,MAAM,CAAC,UAAU,CAAC,MAAM;iBACrC;gBACD,SAAS;aACV,CAAC,CAAC,CAEH;UAAA,CAAC,OAAO,CACV;QAAA,EAAE,UAAU,CACd;MAAA,EAAE,IAAI,CAAC,CACR,CAAC;IACJ,CAAC;IAED,OAAO,CACL,CAAC,UAAU,CACT,IAAI,CAAC,WAAW,CAChB,KAAK,CAAC,OAAO,CACb,KAAK,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC;YACxB;gBACE,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;gBAC5B,UAAU,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;aAC9B;YACD,SAAS;SACV,CAAC,CAAC,CAEH;MAAA,CAAC,OAAO,CACV;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,gFAAgF;AAChF,UAAU;AACV,gFAAgF;AAEhF,eAAe,eAAe,CAAC"}
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* AtomicIcon - Atomic Design System Icon Component
|
|
3
|
-
*
|
|
4
|
-
* Wrapper for the universal Icon component from @domains/icons
|
|
5
|
-
* Provides backward compatibility with AtomicIcon naming convention
|
|
6
|
-
* while leveraging the full power of the icons domain architecture.
|
|
7
|
-
*/
|
|
8
|
-
import React from 'react';
|
|
9
|
-
import type { IconProps, IconSize, IconColor, IconName } from '@umituz/react-native-icon';
|
|
10
|
-
/**
|
|
11
|
-
* AtomicIcon Component
|
|
12
|
-
*
|
|
13
|
-
* @example
|
|
14
|
-
* ```tsx
|
|
15
|
-
* import { AtomicIcon } from '@umituz/react-native-design-system';
|
|
16
|
-
*
|
|
17
|
-
* // Basic usage
|
|
18
|
-
* <AtomicIcon name="Settings" size="md" color="primary" />
|
|
19
|
-
*
|
|
20
|
-
* // Custom size and color
|
|
21
|
-
* <AtomicIcon name="Heart" customSize={32} customColor="#FF0000" />
|
|
22
|
-
*
|
|
23
|
-
* // With background
|
|
24
|
-
* <AtomicIcon name="Info" size="lg" withBackground backgroundColor="#667eea" />
|
|
25
|
-
* ```
|
|
26
|
-
*/
|
|
27
|
-
export declare const AtomicIcon: React.FC<IconProps>;
|
|
28
|
-
/**
|
|
29
|
-
* Re-export types with Atomic naming convention
|
|
30
|
-
*/
|
|
31
|
-
export type AtomicIconProps = IconProps;
|
|
32
|
-
export type AtomicIconSize = IconSize;
|
|
33
|
-
export type AtomicIconColor = IconColor;
|
|
34
|
-
export type AtomicIconName = IconName;
|
|
35
|
-
//# sourceMappingURL=AtomicIcon.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicIcon.d.ts","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicIcon.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAE1F;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAE1C,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,SAAS,CAAC;AACxC,MAAM,MAAM,cAAc,GAAG,QAAQ,CAAC;AACtC,MAAM,MAAM,eAAe,GAAG,SAAS,CAAC;AACxC,MAAM,MAAM,cAAc,GAAG,QAAQ,CAAC"}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* AtomicIcon - Atomic Design System Icon Component
|
|
3
|
-
*
|
|
4
|
-
* Wrapper for the universal Icon component from @domains/icons
|
|
5
|
-
* Provides backward compatibility with AtomicIcon naming convention
|
|
6
|
-
* while leveraging the full power of the icons domain architecture.
|
|
7
|
-
*/
|
|
8
|
-
import React from 'react';
|
|
9
|
-
import { Icon } from '@umituz/react-native-icon';
|
|
10
|
-
/**
|
|
11
|
-
* AtomicIcon Component
|
|
12
|
-
*
|
|
13
|
-
* @example
|
|
14
|
-
* ```tsx
|
|
15
|
-
* import { AtomicIcon } from '@umituz/react-native-design-system';
|
|
16
|
-
*
|
|
17
|
-
* // Basic usage
|
|
18
|
-
* <AtomicIcon name="Settings" size="md" color="primary" />
|
|
19
|
-
*
|
|
20
|
-
* // Custom size and color
|
|
21
|
-
* <AtomicIcon name="Heart" customSize={32} customColor="#FF0000" />
|
|
22
|
-
*
|
|
23
|
-
* // With background
|
|
24
|
-
* <AtomicIcon name="Info" size="lg" withBackground backgroundColor="#667eea" />
|
|
25
|
-
* ```
|
|
26
|
-
*/
|
|
27
|
-
export const AtomicIcon = (props) => {
|
|
28
|
-
return <Icon {...props}/>;
|
|
29
|
-
};
|
|
30
|
-
//# sourceMappingURL=AtomicIcon.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicIcon.js","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicIcon.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAGjD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,KAAK,EAAE,EAAE;IACvD,OAAO,CAAC,IAAI,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AAC7B,CAAC,CAAC"}
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* AtomicImage - Universal Image Component
|
|
3
|
-
*
|
|
4
|
-
* Provides consistent image handling across the app with theme integration
|
|
5
|
-
* Theme: {{THEME_NAME}} ({{CATEGORY}} category)
|
|
6
|
-
*
|
|
7
|
-
* Atomic Design Level: ATOM
|
|
8
|
-
* Purpose: Basic image display with consistent styling
|
|
9
|
-
*
|
|
10
|
-
* Usage:
|
|
11
|
-
* - Profile pictures
|
|
12
|
-
* - Product images
|
|
13
|
-
* - Icons and illustrations
|
|
14
|
-
* - Background images
|
|
15
|
-
*/
|
|
16
|
-
import React from 'react';
|
|
17
|
-
import { ImageProps, ViewStyle } from 'react-native';
|
|
18
|
-
export interface AtomicImageProps extends Omit<ImageProps, 'style'> {
|
|
19
|
-
/** Image source */
|
|
20
|
-
source: ImageProps['source'];
|
|
21
|
-
/** Size variant */
|
|
22
|
-
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
23
|
-
/** Shape variant */
|
|
24
|
-
shape?: 'square' | 'circle' | 'rounded';
|
|
25
|
-
/** Border radius override */
|
|
26
|
-
borderRadius?: number;
|
|
27
|
-
/** Container style override */
|
|
28
|
-
style?: ViewStyle | ViewStyle[];
|
|
29
|
-
/** Image style override */
|
|
30
|
-
imageStyle?: ImageProps['style'];
|
|
31
|
-
/** Background color */
|
|
32
|
-
backgroundColor?: string;
|
|
33
|
-
/** Border color */
|
|
34
|
-
borderColor?: string;
|
|
35
|
-
/** Border width */
|
|
36
|
-
borderWidth?: number;
|
|
37
|
-
}
|
|
38
|
-
export declare const AtomicImage: React.FC<AtomicImageProps>;
|
|
39
|
-
export default AtomicImage;
|
|
40
|
-
//# sourceMappingURL=AtomicImage.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicImage.d.ts","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicImage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,UAAU,EAAc,SAAS,EAAE,MAAM,cAAc,CAAC;AAOxE,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC;IACjE,mBAAmB;IACnB,MAAM,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAC7B,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;IAChD,oBAAoB;IACpB,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;IACxC,6BAA6B;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+BAA+B;IAC/B,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;IAChC,2BAA2B;IAC3B,UAAU,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACjC,uBAAuB;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAmBD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA8ClD,CAAC;AAwCF,eAAe,WAAW,CAAC"}
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* AtomicImage - Universal Image Component
|
|
3
|
-
*
|
|
4
|
-
* Provides consistent image handling across the app with theme integration
|
|
5
|
-
* Theme: {{THEME_NAME}} ({{CATEGORY}} category)
|
|
6
|
-
*
|
|
7
|
-
* Atomic Design Level: ATOM
|
|
8
|
-
* Purpose: Basic image display with consistent styling
|
|
9
|
-
*
|
|
10
|
-
* Usage:
|
|
11
|
-
* - Profile pictures
|
|
12
|
-
* - Product images
|
|
13
|
-
* - Icons and illustrations
|
|
14
|
-
* - Background images
|
|
15
|
-
*/
|
|
16
|
-
import React from 'react';
|
|
17
|
-
import { Image, StyleSheet } from 'react-native';
|
|
18
|
-
import { useAppDesignTokens } from '@umituz/react-native-theme';
|
|
19
|
-
// =============================================================================
|
|
20
|
-
// SIZE CONFIGURATION
|
|
21
|
-
// =============================================================================
|
|
22
|
-
const SIZE_CONFIG = {
|
|
23
|
-
xs: 24,
|
|
24
|
-
sm: 32,
|
|
25
|
-
md: 48,
|
|
26
|
-
lg: 64,
|
|
27
|
-
xl: 96,
|
|
28
|
-
xxl: 128,
|
|
29
|
-
};
|
|
30
|
-
// =============================================================================
|
|
31
|
-
// COMPONENT IMPLEMENTATION
|
|
32
|
-
// =============================================================================
|
|
33
|
-
export const AtomicImage = ({ source, size = 'md', shape = 'rounded', borderRadius, style, imageStyle, backgroundColor, borderColor, borderWidth = 0, ...props }) => {
|
|
34
|
-
const tokens = useAppDesignTokens();
|
|
35
|
-
const styles = getStyles(tokens);
|
|
36
|
-
const imageSize = SIZE_CONFIG[size];
|
|
37
|
-
const calculatedBorderRadius = borderRadius ?? getBorderRadius(shape, imageSize, tokens);
|
|
38
|
-
const containerStyle = [
|
|
39
|
-
styles.container,
|
|
40
|
-
{
|
|
41
|
-
width: imageSize,
|
|
42
|
-
height: imageSize,
|
|
43
|
-
borderRadius: calculatedBorderRadius,
|
|
44
|
-
backgroundColor: backgroundColor || tokens.colors.surface,
|
|
45
|
-
borderColor: borderColor || tokens.colors.border,
|
|
46
|
-
borderWidth,
|
|
47
|
-
},
|
|
48
|
-
style,
|
|
49
|
-
];
|
|
50
|
-
const finalImageStyle = [
|
|
51
|
-
styles.image,
|
|
52
|
-
{
|
|
53
|
-
borderRadius: calculatedBorderRadius,
|
|
54
|
-
},
|
|
55
|
-
imageStyle,
|
|
56
|
-
];
|
|
57
|
-
return (<Image source={source} style={finalImageStyle} {...props}/>);
|
|
58
|
-
};
|
|
59
|
-
// =============================================================================
|
|
60
|
-
// HELPER FUNCTIONS
|
|
61
|
-
// =============================================================================
|
|
62
|
-
const getBorderRadius = (shape, size, tokens) => {
|
|
63
|
-
switch (shape) {
|
|
64
|
-
case 'circle':
|
|
65
|
-
return size / 2;
|
|
66
|
-
case 'square':
|
|
67
|
-
return 0;
|
|
68
|
-
case 'rounded':
|
|
69
|
-
default:
|
|
70
|
-
return tokens.borders.radius.md;
|
|
71
|
-
}
|
|
72
|
-
};
|
|
73
|
-
// =============================================================================
|
|
74
|
-
// STYLES
|
|
75
|
-
// =============================================================================
|
|
76
|
-
const getStyles = (tokens) => StyleSheet.create({
|
|
77
|
-
container: {
|
|
78
|
-
overflow: 'hidden',
|
|
79
|
-
justifyContent: 'center',
|
|
80
|
-
alignItems: 'center',
|
|
81
|
-
},
|
|
82
|
-
image: {
|
|
83
|
-
width: '100%',
|
|
84
|
-
height: '100%',
|
|
85
|
-
resizeMode: 'cover',
|
|
86
|
-
},
|
|
87
|
-
});
|
|
88
|
-
// =============================================================================
|
|
89
|
-
// EXPORTS
|
|
90
|
-
// =============================================================================
|
|
91
|
-
export default AtomicImage;
|
|
92
|
-
//# sourceMappingURL=AtomicImage.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicImage.js","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicImage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAc,UAAU,EAAa,MAAM,cAAc,CAAC;AACxE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AA2BhE,gFAAgF;AAChF,qBAAqB;AACrB,gFAAgF;AAEhF,MAAM,WAAW,GAAG;IAClB,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,GAAG,EAAE,GAAG;CACA,CAAC;AAEX,gFAAgF;AAChF,2BAA2B;AAC3B,gFAAgF;AAEhF,MAAM,CAAC,MAAM,WAAW,GAA+B,CAAC,EACtD,MAAM,EACN,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,SAAS,EACjB,YAAY,EACZ,KAAK,EACL,UAAU,EACV,eAAe,EACf,WAAW,EACX,WAAW,GAAG,CAAC,EACf,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IACpC,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC;IAEjC,MAAM,SAAS,GAAG,WAAW,CAAC,IAAgD,CAAC,CAAC;IAChF,MAAM,sBAAsB,GAAG,YAAY,IAAI,eAAe,CAAC,KAAwC,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC;IAE5H,MAAM,cAAc,GAAG;QACrB,MAAM,CAAC,SAAS;QAChB;YACE,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;YACjB,YAAY,EAAE,sBAAsB;YACpC,eAAe,EAAE,eAAe,IAAI,MAAM,CAAC,MAAM,CAAC,OAAO;YACzD,WAAW,EAAE,WAAW,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM;YAChD,WAAW;SACZ;QACD,KAAK;KACN,CAAC;IAEF,MAAM,eAAe,GAAG;QACtB,MAAM,CAAC,KAAK;QACZ;YACE,YAAY,EAAE,sBAAsB;SACrC;QACD,UAAU;KACX,CAAC;IAEF,OAAO,CACL,CAAC,KAAK,CACJ,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,eAAe,CAAC,CACvB,IAAI,KAAK,CAAC,EACV,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,gFAAgF;AAChF,mBAAmB;AACnB,gFAAgF;AAEhF,MAAM,eAAe,GAAG,CAAC,KAAgC,EAAE,IAAY,EAAE,MAA6C,EAAU,EAAE;IAChI,QAAQ,KAAK,EAAE,CAAC;QACd,KAAK,QAAQ;YACX,OAAO,IAAI,GAAG,CAAC,CAAC;QAClB,KAAK,QAAQ;YACX,OAAO,CAAC,CAAC;QACX,KAAK,SAAS,CAAC;QACf;YACE,OAAO,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;IACpC,CAAC;AACH,CAAC,CAAC;AAEF,gFAAgF;AAChF,SAAS;AACT,gFAAgF;AAEhF,MAAM,SAAS,GAAG,CAAC,MAA6C,EAAE,EAAE,CAClE,UAAU,CAAC,MAAM,CAAC;IAChB,SAAS,EAAE;QACT,QAAQ,EAAE,QAAQ;QAClB,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;KACrB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,OAAO;KACpB;CACF,CAAC,CAAC;AAEL,gFAAgF;AAChF,UAAU;AACV,gFAAgF;AAEhF,eAAe,WAAW,CAAC"}
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { StyleProp, ViewStyle, TextStyle } from 'react-native';
|
|
3
|
-
import type { AtomicIconName } from './AtomicIcon';
|
|
4
|
-
export type AtomicInputVariant = 'outlined' | 'filled' | 'flat';
|
|
5
|
-
export type AtomicInputState = 'default' | 'error' | 'success' | 'disabled';
|
|
6
|
-
export type AtomicInputSize = 'sm' | 'md' | 'lg';
|
|
7
|
-
export interface AtomicInputProps {
|
|
8
|
-
/** Input label */
|
|
9
|
-
label?: string;
|
|
10
|
-
/** Current input value */
|
|
11
|
-
value?: string;
|
|
12
|
-
/** Value change callback */
|
|
13
|
-
onChangeText?: (text: string) => void;
|
|
14
|
-
/** Input variant (outlined, filled, flat) */
|
|
15
|
-
variant?: AtomicInputVariant;
|
|
16
|
-
/** Input state (default, error, success, disabled) */
|
|
17
|
-
state?: AtomicInputState;
|
|
18
|
-
/** Input size (sm, md, lg) */
|
|
19
|
-
size?: AtomicInputSize;
|
|
20
|
-
/** Placeholder text */
|
|
21
|
-
placeholder?: string;
|
|
22
|
-
/** Helper text below input */
|
|
23
|
-
helperText?: string;
|
|
24
|
-
/** Leading icon (Lucide icon name) */
|
|
25
|
-
leadingIcon?: AtomicIconName;
|
|
26
|
-
/** Trailing icon (Lucide icon name) */
|
|
27
|
-
trailingIcon?: AtomicIconName;
|
|
28
|
-
/** Callback when trailing icon is pressed */
|
|
29
|
-
onTrailingIconPress?: () => void;
|
|
30
|
-
/** Show password toggle for secure inputs */
|
|
31
|
-
showPasswordToggle?: boolean;
|
|
32
|
-
/** Secure text entry (password field) */
|
|
33
|
-
secureTextEntry?: boolean;
|
|
34
|
-
/** Maximum character length */
|
|
35
|
-
maxLength?: number;
|
|
36
|
-
/** Show character counter */
|
|
37
|
-
showCharacterCount?: boolean;
|
|
38
|
-
/** Keyboard type */
|
|
39
|
-
keyboardType?: 'default' | 'email-address' | 'numeric' | 'phone-pad' | 'url' | 'number-pad' | 'decimal-pad';
|
|
40
|
-
/** Auto-capitalize */
|
|
41
|
-
autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';
|
|
42
|
-
/** Auto-correct */
|
|
43
|
-
autoCorrect?: boolean;
|
|
44
|
-
/** Disabled state */
|
|
45
|
-
disabled?: boolean;
|
|
46
|
-
/** Container style */
|
|
47
|
-
style?: StyleProp<ViewStyle>;
|
|
48
|
-
/** Input text style */
|
|
49
|
-
inputStyle?: StyleProp<TextStyle>;
|
|
50
|
-
/** Test ID for E2E testing */
|
|
51
|
-
testID?: string;
|
|
52
|
-
/** Blur callback */
|
|
53
|
-
onBlur?: () => void;
|
|
54
|
-
/** Focus callback */
|
|
55
|
-
onFocus?: () => void;
|
|
56
|
-
}
|
|
57
|
-
/**
|
|
58
|
-
* AtomicInput - Pure React Native Text Input
|
|
59
|
-
*
|
|
60
|
-
* Features:
|
|
61
|
-
* - Pure React Native implementation (no Paper dependency)
|
|
62
|
-
* - Lucide icons for password toggle and custom icons
|
|
63
|
-
* - Outlined/filled/flat variants
|
|
64
|
-
* - Error, success, disabled states
|
|
65
|
-
* - Character counter
|
|
66
|
-
* - Responsive sizing
|
|
67
|
-
* - Full accessibility support
|
|
68
|
-
*/
|
|
69
|
-
export declare const AtomicInput: React.FC<AtomicInputProps>;
|
|
70
|
-
export type { AtomicInputProps as InputProps };
|
|
71
|
-
//# sourceMappingURL=AtomicInput.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AtomicInput.d.ts","sourceRoot":"","sources":["../../../src/presentation/atoms/AtomicInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAA0C,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIvG,OAAO,KAAK,EAAE,cAAc,EAAkB,MAAM,cAAc,CAAC;AAEnE,MAAM,MAAM,kBAAkB,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;AAChE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;AAC5E,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEjD,MAAM,WAAW,gBAAgB;IAC/B,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0BAA0B;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,6CAA6C;IAC7C,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,sDAAsD;IACtD,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B,uCAAuC;IACvC,YAAY,CAAC,EAAE,cAAc,CAAC;IAC9B,6CAA6C;IAC7C,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,6CAA6C;IAC7C,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,yCAAyC;IACzC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,oBAAoB;IACpB,YAAY,CAAC,EAAE,SAAS,GAAG,eAAe,GAAG,SAAS,GAAG,WAAW,GAAG,KAAK,GAAG,YAAY,GAAG,aAAa,CAAC;IAC5G,sBAAsB;IACtB,cAAc,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,YAAY,CAAC;IAC/D,mBAAmB;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,uBAAuB;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,oBAAoB;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA+OlD,CAAC;AAoCF,YAAY,EAAE,gBAAgB,IAAI,UAAU,EAAE,CAAC"}
|