@umituz/react-native-design-system 1.5.0 → 1.5.2
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/index.d.ts +4 -4
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +13 -11
- package/lib/index.js.map +1 -1
- package/lib/presentation/atoms/AtomicAvatar.js +1 -1
- package/lib/presentation/atoms/AtomicAvatar.js.map +1 -1
- package/lib/presentation/atoms/AtomicAvatarGroup.js +1 -1
- package/lib/presentation/atoms/AtomicAvatarGroup.js.map +1 -1
- package/lib/presentation/atoms/AtomicBadge.js +1 -1
- package/lib/presentation/atoms/AtomicBadge.js.map +1 -1
- package/lib/presentation/atoms/AtomicButton.d.ts +1 -1
- package/lib/presentation/atoms/AtomicButton.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicButton.js +2 -2
- package/lib/presentation/atoms/AtomicButton.js.map +1 -1
- package/lib/presentation/atoms/AtomicCard.js +1 -1
- package/lib/presentation/atoms/AtomicCard.js.map +1 -1
- package/lib/presentation/atoms/AtomicChip.js +1 -1
- package/lib/presentation/atoms/AtomicChip.js.map +1 -1
- package/lib/presentation/atoms/AtomicDatePicker.js +1 -1
- package/lib/presentation/atoms/AtomicDatePicker.js.map +1 -1
- package/lib/presentation/atoms/AtomicDivider.js +1 -1
- package/lib/presentation/atoms/AtomicDivider.js.map +1 -1
- package/lib/presentation/atoms/AtomicFab.js +1 -1
- package/lib/presentation/atoms/AtomicFab.js.map +1 -1
- package/lib/presentation/atoms/AtomicFilter.js +1 -1
- package/lib/presentation/atoms/AtomicFilter.js.map +1 -1
- package/lib/presentation/atoms/AtomicFormError.js +2 -2
- package/lib/presentation/atoms/AtomicFormError.js.map +1 -1
- package/lib/presentation/atoms/AtomicIcon.d.ts +2 -3
- package/lib/presentation/atoms/AtomicIcon.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicIcon.js +1 -1
- package/lib/presentation/atoms/AtomicIcon.js.map +1 -1
- package/lib/presentation/atoms/AtomicImage.js +1 -1
- package/lib/presentation/atoms/AtomicImage.js.map +1 -1
- package/lib/presentation/atoms/AtomicInput.js +1 -1
- package/lib/presentation/atoms/AtomicInput.js.map +1 -1
- package/lib/presentation/atoms/AtomicPicker.js +1 -1
- package/lib/presentation/atoms/AtomicPicker.js.map +1 -1
- package/lib/presentation/atoms/AtomicProgress.js +1 -1
- package/lib/presentation/atoms/AtomicProgress.js.map +1 -1
- package/lib/presentation/atoms/AtomicSearchBar.js +1 -1
- package/lib/presentation/atoms/AtomicSearchBar.js.map +1 -1
- package/lib/presentation/atoms/AtomicSort.js +1 -1
- package/lib/presentation/atoms/AtomicSort.js.map +1 -1
- package/lib/presentation/atoms/AtomicSwitch.js +1 -1
- package/lib/presentation/atoms/AtomicSwitch.js.map +1 -1
- package/lib/presentation/atoms/AtomicText.d.ts +21 -1
- package/lib/presentation/atoms/AtomicText.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicText.js +33 -10
- package/lib/presentation/atoms/AtomicText.js.map +1 -1
- package/lib/presentation/atoms/AtomicTextArea.js +1 -1
- package/lib/presentation/atoms/AtomicTextArea.js.map +1 -1
- package/lib/presentation/atoms/AtomicTouchable.js +1 -1
- package/lib/presentation/atoms/AtomicTouchable.js.map +1 -1
- package/lib/presentation/atoms/fab/styles/fabStyles.d.ts +1 -1
- package/lib/presentation/atoms/fab/styles/fabStyles.d.ts.map +1 -1
- package/lib/presentation/atoms/index.d.ts +1 -1
- package/lib/presentation/atoms/input/styles/inputStyles.d.ts +1 -1
- package/lib/presentation/atoms/input/styles/inputStyles.d.ts.map +1 -1
- package/lib/presentation/atoms/picker/styles/pickerStyles.d.ts +12 -23
- package/lib/presentation/atoms/picker/styles/pickerStyles.d.ts.map +1 -1
- package/lib/presentation/atoms/picker/styles/pickerStyles.js.map +1 -1
- package/lib/presentation/molecules/AtomicConfirmationModal.js +1 -1
- package/lib/presentation/molecules/AtomicConfirmationModal.js.map +1 -1
- package/lib/presentation/molecules/EmptyState.js +1 -1
- package/lib/presentation/molecules/EmptyState.js.map +1 -1
- package/lib/presentation/molecules/FormField.js +1 -1
- package/lib/presentation/molecules/FormField.js.map +1 -1
- package/lib/presentation/molecules/IconContainer.js +1 -1
- package/lib/presentation/molecules/IconContainer.js.map +1 -1
- package/lib/presentation/molecules/ListItem.js +1 -1
- package/lib/presentation/molecules/ListItem.js.map +1 -1
- package/lib/presentation/molecules/ScreenHeader.js +1 -1
- package/lib/presentation/molecules/ScreenHeader.js.map +1 -1
- package/lib/presentation/molecules/SearchBar.js +1 -1
- package/lib/presentation/molecules/SearchBar.js.map +1 -1
- package/lib/presentation/molecules/SectionCard.js +1 -1
- package/lib/presentation/molecules/SectionCard.js.map +1 -1
- package/lib/presentation/molecules/SectionContainer.js +1 -1
- package/lib/presentation/molecules/SectionContainer.js.map +1 -1
- package/lib/presentation/molecules/SectionHeader.js +1 -1
- package/lib/presentation/molecules/SectionHeader.js.map +1 -1
- package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.d.ts +1 -1
- package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.d.ts.map +1 -1
- package/lib/presentation/molecules/listitem/styles/listItemStyles.d.ts +1 -1
- package/lib/presentation/molecules/listitem/styles/listItemStyles.d.ts.map +1 -1
- package/lib/presentation/organisms/AppHeader.d.ts +3 -2
- package/lib/presentation/organisms/AppHeader.d.ts.map +1 -1
- package/lib/presentation/organisms/AppHeader.js +1 -1
- package/lib/presentation/organisms/AppHeader.js.map +1 -1
- package/lib/presentation/organisms/FormContainer.js +1 -1
- package/lib/presentation/organisms/FormContainer.js.map +1 -1
- package/lib/presentation/organisms/ScreenLayout.js +1 -1
- package/lib/presentation/organisms/ScreenLayout.js.map +1 -1
- package/lib/presentation/tokens/commonStyles.js +1 -1
- package/lib/presentation/tokens/commonStyles.js.map +1 -1
- package/package.json +1 -1
- package/src/index.ts +16 -16
- package/src/presentation/atoms/AtomicAvatar.tsx +1 -1
- package/src/presentation/atoms/AtomicAvatarGroup.tsx +1 -1
- package/src/presentation/atoms/AtomicBadge.tsx +2 -2
- package/src/presentation/atoms/AtomicButton.tsx +3 -3
- package/src/presentation/atoms/AtomicCard.tsx +1 -1
- package/src/presentation/atoms/AtomicChip.tsx +1 -1
- package/src/presentation/atoms/AtomicDatePicker.tsx +1 -1
- package/src/presentation/atoms/AtomicDivider.tsx +1 -1
- package/src/presentation/atoms/AtomicFab.tsx +1 -1
- package/src/presentation/atoms/AtomicFilter.tsx +1 -1
- package/src/presentation/atoms/AtomicFormError.tsx +2 -2
- package/src/presentation/atoms/AtomicIcon.tsx +3 -4
- package/src/presentation/atoms/AtomicImage.tsx +1 -1
- package/src/presentation/atoms/AtomicInput.tsx +1 -1
- package/src/presentation/atoms/AtomicPicker.tsx +1 -1
- package/src/presentation/atoms/AtomicProgress.tsx +1 -1
- package/src/presentation/atoms/AtomicSearchBar.tsx +1 -1
- package/src/presentation/atoms/AtomicSort.tsx +1 -1
- package/src/presentation/atoms/AtomicSwitch.tsx +1 -1
- package/src/presentation/atoms/AtomicText.tsx +83 -13
- package/src/presentation/atoms/AtomicTextArea.tsx +1 -1
- package/src/presentation/atoms/AtomicTouchable.tsx +1 -1
- package/src/presentation/atoms/fab/styles/fabStyles.ts +1 -1
- package/src/presentation/atoms/input/styles/inputStyles.ts +1 -1
- package/src/presentation/atoms/picker/styles/pickerStyles.ts +13 -6
- package/src/presentation/molecules/AtomicConfirmationModal.tsx +1 -1
- package/src/presentation/molecules/EmptyState.tsx +1 -1
- package/src/presentation/molecules/FormField.tsx +1 -1
- package/src/presentation/molecules/IconContainer.tsx +1 -1
- package/src/presentation/molecules/ListItem.tsx +1 -1
- package/src/presentation/molecules/ScreenHeader.tsx +1 -1
- package/src/presentation/molecules/SearchBar.tsx +1 -1
- package/src/presentation/molecules/SectionCard.tsx +1 -1
- package/src/presentation/molecules/SectionContainer.tsx +1 -1
- package/src/presentation/molecules/SectionHeader.tsx +1 -1
- package/src/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.ts +1 -1
- package/src/presentation/molecules/listitem/styles/listItemStyles.ts +1 -1
- package/src/presentation/organisms/AppHeader.tsx +4 -3
- package/src/presentation/organisms/FormContainer.tsx +1 -1
- package/src/presentation/organisms/ScreenLayout.tsx +1 -1
- package/src/presentation/tokens/commonStyles.ts +1 -1
- package/lib/domains/icons/domain/config/IconLibraryConfig.d.ts +0 -91
- package/lib/domains/icons/domain/config/IconLibraryConfig.d.ts.map +0 -1
- package/lib/domains/icons/domain/config/IconLibraryConfig.js +0 -85
- package/lib/domains/icons/domain/config/IconLibraryConfig.js.map +0 -1
- package/lib/domains/icons/domain/entities/Icon.d.ts +0 -111
- package/lib/domains/icons/domain/entities/Icon.d.ts.map +0 -1
- package/lib/domains/icons/domain/entities/Icon.js +0 -87
- package/lib/domains/icons/domain/entities/Icon.js.map +0 -1
- package/lib/domains/icons/domain/interfaces/IIconAdapter.d.ts +0 -114
- package/lib/domains/icons/domain/interfaces/IIconAdapter.d.ts.map +0 -1
- package/lib/domains/icons/domain/interfaces/IIconAdapter.js +0 -17
- package/lib/domains/icons/domain/interfaces/IIconAdapter.js.map +0 -1
- package/lib/domains/icons/index.d.ts +0 -84
- package/lib/domains/icons/index.d.ts.map +0 -1
- package/lib/domains/icons/index.js +0 -89
- package/lib/domains/icons/index.js.map +0 -1
- package/lib/domains/icons/infrastructure/adapters/LucideAdapter.d.ts +0 -24
- package/lib/domains/icons/infrastructure/adapters/LucideAdapter.d.ts.map +0 -1
- package/lib/domains/icons/infrastructure/adapters/LucideAdapter.js +0 -85
- package/lib/domains/icons/infrastructure/adapters/LucideAdapter.js.map +0 -1
- package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.d.ts +0 -23
- package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.d.ts.map +0 -1
- package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.js +0 -178
- package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.js.map +0 -1
- package/lib/domains/icons/presentation/components/Icon.d.ts +0 -42
- package/lib/domains/icons/presentation/components/Icon.d.ts.map +0 -1
- package/lib/domains/icons/presentation/components/Icon.js +0 -86
- package/lib/domains/icons/presentation/components/Icon.js.map +0 -1
- package/lib/domains/icons/presentation/hooks/useIconLibrary.d.ts +0 -38
- package/lib/domains/icons/presentation/hooks/useIconLibrary.d.ts.map +0 -1
- package/lib/domains/icons/presentation/hooks/useIconLibrary.js +0 -114
- package/lib/domains/icons/presentation/hooks/useIconLibrary.js.map +0 -1
- package/lib/infrastructure/theme/globalThemeStore.d.ts +0 -42
- package/lib/infrastructure/theme/globalThemeStore.d.ts.map +0 -1
- package/lib/infrastructure/theme/globalThemeStore.js +0 -38
- package/lib/infrastructure/theme/globalThemeStore.js.map +0 -1
- package/lib/presentation/hooks/useAppDesignTokens.d.ts +0 -34
- package/lib/presentation/hooks/useAppDesignTokens.d.ts.map +0 -1
- package/lib/presentation/hooks/useAppDesignTokens.js +0 -39
- package/lib/presentation/hooks/useAppDesignTokens.js.map +0 -1
- package/lib/presentation/tokens/AppDesignTokens.d.ts +0 -14
- package/lib/presentation/tokens/AppDesignTokens.d.ts.map +0 -1
- package/lib/presentation/tokens/AppDesignTokens.js +0 -23
- package/lib/presentation/tokens/AppDesignTokens.js.map +0 -1
- package/lib/presentation/tokens/core/BaseTokens.d.ts +0 -312
- package/lib/presentation/tokens/core/BaseTokens.d.ts.map +0 -1
- package/lib/presentation/tokens/core/BaseTokens.js +0 -304
- package/lib/presentation/tokens/core/BaseTokens.js.map +0 -1
- package/lib/presentation/tokens/core/ColorPalette.d.ts +0 -216
- package/lib/presentation/tokens/core/ColorPalette.d.ts.map +0 -1
- package/lib/presentation/tokens/core/ColorPalette.js +0 -330
- package/lib/presentation/tokens/core/ColorPalette.js.map +0 -1
- package/lib/presentation/tokens/core/TokenFactory.d.ts +0 -216
- package/lib/presentation/tokens/core/TokenFactory.d.ts.map +0 -1
- package/lib/presentation/tokens/core/TokenFactory.js +0 -86
- package/lib/presentation/tokens/core/TokenFactory.js.map +0 -1
- package/src/domains/icons/domain/config/IconLibraryConfig.ts +0 -93
- package/src/domains/icons/domain/entities/Icon.ts +0 -143
- package/src/domains/icons/domain/interfaces/IIconAdapter.ts +0 -147
- package/src/domains/icons/index.ts +0 -109
- package/src/domains/icons/infrastructure/adapters/LucideAdapter.ts +0 -100
- package/src/domains/icons/infrastructure/registries/ExpoIconRegistry.ts +0 -191
- package/src/domains/icons/presentation/components/Icon.tsx +0 -132
- package/src/domains/icons/presentation/hooks/useIconLibrary.ts +0 -141
- package/src/infrastructure/theme/globalThemeStore.ts +0 -51
- package/src/presentation/hooks/useAppDesignTokens.ts +0 -40
- package/src/presentation/tokens/AppDesignTokens.ts +0 -55
- package/src/presentation/tokens/core/BaseTokens.ts +0 -372
- package/src/presentation/tokens/core/ColorPalette.ts +0 -400
- package/src/presentation/tokens/core/TokenFactory.ts +0 -118
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Icon Library Configuration
|
|
3
|
-
*
|
|
4
|
-
* 🔧 SINGLE SOURCE OF TRUTH FOR ICON LIBRARY SELECTION
|
|
5
|
-
*
|
|
6
|
-
* To change icon library:
|
|
7
|
-
* 1. Update package.json with new library
|
|
8
|
-
* 2. Change CURRENT_LIBRARY below
|
|
9
|
-
* 3. Create adapter if needed (infrastructure/adapters/)
|
|
10
|
-
* 4. Done! All apps automatically use new library
|
|
11
|
-
*
|
|
12
|
-
* @example
|
|
13
|
-
* // Switch to Material Icons:
|
|
14
|
-
* export const CURRENT_LIBRARY: IconLibraryType = 'material';
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
export type IconLibraryType = 'lucide' | 'material' | 'fontawesome' | 'ionicons';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* 🔧 CHANGE THIS TO SWITCH ICON LIBRARY
|
|
21
|
-
*/
|
|
22
|
-
export const CURRENT_LIBRARY: IconLibraryType = 'lucide';
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* Icon Library Configuration
|
|
26
|
-
*/
|
|
27
|
-
export const ICON_LIBRARY_CONFIG = {
|
|
28
|
-
/**
|
|
29
|
-
* Current icon library in use
|
|
30
|
-
*/
|
|
31
|
-
library: CURRENT_LIBRARY,
|
|
32
|
-
|
|
33
|
-
/**
|
|
34
|
-
* Default icon size (in pixels)
|
|
35
|
-
*/
|
|
36
|
-
defaultSize: 24,
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* Default stroke width for outline icons
|
|
40
|
-
*/
|
|
41
|
-
defaultStrokeWidth: 2,
|
|
42
|
-
|
|
43
|
-
/**
|
|
44
|
-
* Library metadata
|
|
45
|
-
*/
|
|
46
|
-
libraries: {
|
|
47
|
-
lucide: {
|
|
48
|
-
name: 'Lucide',
|
|
49
|
-
package: 'lucide-react-native',
|
|
50
|
-
version: '^0.468.0',
|
|
51
|
-
iconCount: 1639,
|
|
52
|
-
type: 'outline',
|
|
53
|
-
adapter: 'LucideAdapter',
|
|
54
|
-
},
|
|
55
|
-
material: {
|
|
56
|
-
name: 'Material Icons',
|
|
57
|
-
package: '@expo/vector-icons',
|
|
58
|
-
version: '^14.0.0',
|
|
59
|
-
iconCount: 2000,
|
|
60
|
-
type: 'filled',
|
|
61
|
-
adapter: 'MaterialAdapter',
|
|
62
|
-
},
|
|
63
|
-
fontawesome: {
|
|
64
|
-
name: 'Font Awesome',
|
|
65
|
-
package: '@expo/vector-icons',
|
|
66
|
-
version: '^14.0.0',
|
|
67
|
-
iconCount: 1500,
|
|
68
|
-
type: 'solid',
|
|
69
|
-
adapter: 'FontAwesomeAdapter',
|
|
70
|
-
},
|
|
71
|
-
ionicons: {
|
|
72
|
-
name: 'Ionicons',
|
|
73
|
-
package: '@expo/vector-icons',
|
|
74
|
-
version: '^14.0.0',
|
|
75
|
-
iconCount: 1300,
|
|
76
|
-
type: 'outline',
|
|
77
|
-
adapter: 'IoniconsAdapter',
|
|
78
|
-
},
|
|
79
|
-
},
|
|
80
|
-
} as const;
|
|
81
|
-
|
|
82
|
-
/**
|
|
83
|
-
* Get current library metadata
|
|
84
|
-
*/
|
|
85
|
-
export const getCurrentLibrary = () => {
|
|
86
|
-
return ICON_LIBRARY_CONFIG.libraries[CURRENT_LIBRARY];
|
|
87
|
-
};
|
|
88
|
-
|
|
89
|
-
/**
|
|
90
|
-
* Type-safe library check
|
|
91
|
-
* Factory uses Lucide icons only
|
|
92
|
-
*/
|
|
93
|
-
export const isLucideLibrary = () => true;
|
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Icons Domain - Entities
|
|
3
|
-
*
|
|
4
|
-
* Core icon types and interfaces for the App Factory.
|
|
5
|
-
* Provides unified access to Lucide icons (design-system) + Expo vector icons.
|
|
6
|
-
*
|
|
7
|
-
* @domain icons
|
|
8
|
-
* @layer domain
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Icon library types
|
|
13
|
-
* - lucide: Lucide React Native icons (already in design-system/AtomicIcon)
|
|
14
|
-
* - material: Material Design icons (@expo/vector-icons)
|
|
15
|
-
* - fontawesome: FontAwesome icons (@expo/vector-icons)
|
|
16
|
-
* - ionicons: Ionicons (@expo/vector-icons)
|
|
17
|
-
*/
|
|
18
|
-
export enum IconLibrary {
|
|
19
|
-
LUCIDE = 'lucide',
|
|
20
|
-
MATERIAL = 'material',
|
|
21
|
-
FONTAWESOME = 'fontawesome',
|
|
22
|
-
IONICONS = 'ionicons',
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
/**
|
|
26
|
-
* Icon category for organization
|
|
27
|
-
*/
|
|
28
|
-
export enum IconCategory {
|
|
29
|
-
ALL = 'all',
|
|
30
|
-
NAVIGATION = 'navigation',
|
|
31
|
-
ACTION = 'action',
|
|
32
|
-
SOCIAL = 'social',
|
|
33
|
-
COMMUNICATION = 'communication',
|
|
34
|
-
MEDIA = 'media',
|
|
35
|
-
BUSINESS = 'business',
|
|
36
|
-
WEATHER = 'weather',
|
|
37
|
-
SYMBOLS = 'symbols',
|
|
38
|
-
EMOJI = 'emoji',
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
/**
|
|
42
|
-
* Icon metadata for registry
|
|
43
|
-
*/
|
|
44
|
-
export interface IconMetadata {
|
|
45
|
-
name: string;
|
|
46
|
-
library: IconLibrary;
|
|
47
|
-
category: IconCategory;
|
|
48
|
-
tags: string[];
|
|
49
|
-
searchTerms: string[];
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
/**
|
|
53
|
-
* Icon registry interface
|
|
54
|
-
*/
|
|
55
|
-
export interface IIconRegistry {
|
|
56
|
-
/**
|
|
57
|
-
* Get all icons in the library
|
|
58
|
-
*/
|
|
59
|
-
getAllIcons(): IconMetadata[];
|
|
60
|
-
|
|
61
|
-
/**
|
|
62
|
-
* Get icons by category
|
|
63
|
-
*/
|
|
64
|
-
getIconsByCategory(category: IconCategory): IconMetadata[];
|
|
65
|
-
|
|
66
|
-
/**
|
|
67
|
-
* Search icons by query
|
|
68
|
-
*/
|
|
69
|
-
searchIcons(query: string): IconMetadata[];
|
|
70
|
-
|
|
71
|
-
/**
|
|
72
|
-
* Get icon metadata by name
|
|
73
|
-
*/
|
|
74
|
-
getIconMetadata(name: string): IconMetadata | null;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* Icon picker configuration
|
|
79
|
-
*/
|
|
80
|
-
export interface IconPickerConfig {
|
|
81
|
-
libraries: IconLibrary[];
|
|
82
|
-
categories: IconCategory[];
|
|
83
|
-
showSearch: boolean;
|
|
84
|
-
multiSelect: boolean;
|
|
85
|
-
maxSelections?: number;
|
|
86
|
-
onSelect: (icons: IconMetadata[]) => void;
|
|
87
|
-
onCancel?: () => void;
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
/**
|
|
91
|
-
* Icon constants
|
|
92
|
-
*/
|
|
93
|
-
export const ICON_CONSTANTS = {
|
|
94
|
-
DEFAULT_SIZE: 24,
|
|
95
|
-
DEFAULT_COLOR: 'onSurface',
|
|
96
|
-
DEFAULT_LIBRARY: IconLibrary.LUCIDE,
|
|
97
|
-
MAX_SEARCH_RESULTS: 50,
|
|
98
|
-
} as const;
|
|
99
|
-
|
|
100
|
-
/**
|
|
101
|
-
* Icon utility functions
|
|
102
|
-
*/
|
|
103
|
-
export const IconUtils = {
|
|
104
|
-
/**
|
|
105
|
-
* Normalize icon name for search
|
|
106
|
-
*/
|
|
107
|
-
normalizeIconName: (name: string): string => {
|
|
108
|
-
return name.toLowerCase().replace(/[^a-z0-9]/g, '');
|
|
109
|
-
},
|
|
110
|
-
|
|
111
|
-
/**
|
|
112
|
-
* Match search query against icon metadata
|
|
113
|
-
*/
|
|
114
|
-
matchesSearch: (icon: IconMetadata, query: string): boolean => {
|
|
115
|
-
const normalizedQuery = IconUtils.normalizeIconName(query);
|
|
116
|
-
const normalizedName = IconUtils.normalizeIconName(icon.name);
|
|
117
|
-
const normalizedTags = icon.tags.map(tag => IconUtils.normalizeIconName(tag));
|
|
118
|
-
const normalizedTerms = icon.searchTerms.map(term => IconUtils.normalizeIconName(term));
|
|
119
|
-
|
|
120
|
-
return (
|
|
121
|
-
normalizedName.includes(normalizedQuery) ||
|
|
122
|
-
normalizedTags.some(tag => tag.includes(normalizedQuery)) ||
|
|
123
|
-
normalizedTerms.some(term => term.includes(normalizedQuery))
|
|
124
|
-
);
|
|
125
|
-
},
|
|
126
|
-
|
|
127
|
-
/**
|
|
128
|
-
* Filter icons by category
|
|
129
|
-
*/
|
|
130
|
-
filterByCategory: (icons: IconMetadata[], category: IconCategory): IconMetadata[] => {
|
|
131
|
-
if (category === IconCategory.ALL) {
|
|
132
|
-
return icons;
|
|
133
|
-
}
|
|
134
|
-
return icons.filter(icon => icon.category === category);
|
|
135
|
-
},
|
|
136
|
-
|
|
137
|
-
/**
|
|
138
|
-
* Sort icons alphabetically
|
|
139
|
-
*/
|
|
140
|
-
sortByName: (icons: IconMetadata[]): IconMetadata[] => {
|
|
141
|
-
return [...icons].sort((a, b) => a.name.localeCompare(b.name));
|
|
142
|
-
},
|
|
143
|
-
};
|
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Icon Adapter Interface
|
|
3
|
-
*
|
|
4
|
-
* Universal interface that all icon library adapters must implement.
|
|
5
|
-
* This allows seamless switching between icon libraries.
|
|
6
|
-
*
|
|
7
|
-
* @example
|
|
8
|
-
* // Implementing for a new library:
|
|
9
|
-
* export const MyLibraryAdapter: IIconAdapter = {
|
|
10
|
-
* getIconComponent: (name) => MyIcons[name],
|
|
11
|
-
* getIconSize: (size) => sizeMap[size],
|
|
12
|
-
* getIconColor: (color, tokens) => colorMap[color],
|
|
13
|
-
* getAllIcons: () => Object.keys(MyIcons),
|
|
14
|
-
* };
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
import type { ComponentType } from 'react';
|
|
18
|
-
import type { ViewStyle } from 'react-native';
|
|
19
|
-
import type { DesignTokens } from '../../../../presentation/tokens/core/TokenFactory';
|
|
20
|
-
|
|
21
|
-
export type IconName = string;
|
|
22
|
-
export type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
23
|
-
export type IconColor =
|
|
24
|
-
| 'primary'
|
|
25
|
-
| 'secondary'
|
|
26
|
-
| 'success'
|
|
27
|
-
| 'warning'
|
|
28
|
-
| 'error'
|
|
29
|
-
| 'info'
|
|
30
|
-
| 'onSurface'
|
|
31
|
-
| 'surfaceVariant'
|
|
32
|
-
| 'onPrimary'
|
|
33
|
-
| 'onSecondary'
|
|
34
|
-
| 'textInverse';
|
|
35
|
-
|
|
36
|
-
/**
|
|
37
|
-
* Icon Adapter Interface
|
|
38
|
-
* All icon library adapters must implement this interface
|
|
39
|
-
*/
|
|
40
|
-
export interface IIconAdapter {
|
|
41
|
-
/**
|
|
42
|
-
* Get the icon component for a given icon name
|
|
43
|
-
* @param name - Icon name (library-specific)
|
|
44
|
-
* @returns Icon component or null if not found
|
|
45
|
-
*/
|
|
46
|
-
getIconComponent: (name: string) => ComponentType<any> | null;
|
|
47
|
-
|
|
48
|
-
/**
|
|
49
|
-
* Convert semantic size to pixel size
|
|
50
|
-
* @param size - Semantic size (xs, sm, md, lg, xl, xxl)
|
|
51
|
-
* @param customSize - Optional custom pixel size
|
|
52
|
-
* @returns Pixel size
|
|
53
|
-
*/
|
|
54
|
-
getIconSize: (size: IconSize, customSize?: number) => number;
|
|
55
|
-
|
|
56
|
-
/**
|
|
57
|
-
* Convert semantic color to hex color
|
|
58
|
-
* @param color - Semantic color name
|
|
59
|
-
* @param tokens - Design tokens for theme colors
|
|
60
|
-
* @param customColor - Optional custom hex color
|
|
61
|
-
* @returns Hex color string
|
|
62
|
-
*/
|
|
63
|
-
getIconColor: (
|
|
64
|
-
color: IconColor,
|
|
65
|
-
tokens: DesignTokens,
|
|
66
|
-
customColor?: string
|
|
67
|
-
) => string;
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* Get all available icon names for this library
|
|
71
|
-
* @returns Array of icon names
|
|
72
|
-
*/
|
|
73
|
-
getAllIcons: () => string[];
|
|
74
|
-
|
|
75
|
-
/**
|
|
76
|
-
* Check if an icon exists in the library
|
|
77
|
-
* @param name - Icon name to check
|
|
78
|
-
* @returns True if icon exists
|
|
79
|
-
*/
|
|
80
|
-
hasIcon: (name: string) => boolean;
|
|
81
|
-
|
|
82
|
-
/**
|
|
83
|
-
* Get default stroke width for outline icons
|
|
84
|
-
* @returns Stroke width number
|
|
85
|
-
*/
|
|
86
|
-
getStrokeWidth?: () => number;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
/**
|
|
90
|
-
* Icon Props - Universal props for Icon component
|
|
91
|
-
*/
|
|
92
|
-
export interface IconProps {
|
|
93
|
-
/**
|
|
94
|
-
* Icon name (library-specific)
|
|
95
|
-
*/
|
|
96
|
-
name: string;
|
|
97
|
-
|
|
98
|
-
/**
|
|
99
|
-
* Icon size preset
|
|
100
|
-
*/
|
|
101
|
-
size?: IconSize;
|
|
102
|
-
|
|
103
|
-
/**
|
|
104
|
-
* Custom pixel size (overrides size preset)
|
|
105
|
-
*/
|
|
106
|
-
customSize?: number;
|
|
107
|
-
|
|
108
|
-
/**
|
|
109
|
-
* Semantic color
|
|
110
|
-
*/
|
|
111
|
-
color?: IconColor;
|
|
112
|
-
|
|
113
|
-
/**
|
|
114
|
-
* Custom hex color (overrides semantic color)
|
|
115
|
-
*/
|
|
116
|
-
customColor?: string;
|
|
117
|
-
|
|
118
|
-
/**
|
|
119
|
-
* Stroke width for outline icons
|
|
120
|
-
*/
|
|
121
|
-
strokeWidth?: number;
|
|
122
|
-
|
|
123
|
-
/**
|
|
124
|
-
* Background circle for icon
|
|
125
|
-
*/
|
|
126
|
-
withBackground?: boolean;
|
|
127
|
-
|
|
128
|
-
/**
|
|
129
|
-
* Background color
|
|
130
|
-
*/
|
|
131
|
-
backgroundColor?: string;
|
|
132
|
-
|
|
133
|
-
/**
|
|
134
|
-
* Accessibility label
|
|
135
|
-
*/
|
|
136
|
-
accessibilityLabel?: string;
|
|
137
|
-
|
|
138
|
-
/**
|
|
139
|
-
* Test ID
|
|
140
|
-
*/
|
|
141
|
-
testID?: string;
|
|
142
|
-
|
|
143
|
-
/**
|
|
144
|
-
* Custom styles
|
|
145
|
-
*/
|
|
146
|
-
style?: ViewStyle;
|
|
147
|
-
}
|
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Icons Domain - Centralized Icon System
|
|
3
|
-
*
|
|
4
|
-
* 🎯 SINGLE SOURCE OF TRUTH FOR ALL ICONS
|
|
5
|
-
*
|
|
6
|
-
* Universal icon library system with easy library switching.
|
|
7
|
-
* Change icon library = change one config file!
|
|
8
|
-
*
|
|
9
|
-
* @domain icons
|
|
10
|
-
* @enabled true (All apps)
|
|
11
|
-
*
|
|
12
|
-
* ARCHITECTURE:
|
|
13
|
-
* ```
|
|
14
|
-
* domains/icons/
|
|
15
|
-
* ├── domain/
|
|
16
|
-
* │ ├── config/
|
|
17
|
-
* │ │ └── IconLibraryConfig.ts 🔧 Change library here!
|
|
18
|
-
* │ └── interfaces/
|
|
19
|
-
* │ └── IIconAdapter.ts Interface for adapters
|
|
20
|
-
* ├── infrastructure/
|
|
21
|
-
* │ └── adapters/
|
|
22
|
-
* │ ├── LucideAdapter.ts Current: Lucide (1,639 icons)
|
|
23
|
-
* │ ├── MaterialAdapter.ts Future: Material Icons
|
|
24
|
-
* │ └── FontAwesomeAdapter.ts Future: Font Awesome
|
|
25
|
-
* └── presentation/
|
|
26
|
-
* └── components/
|
|
27
|
-
* └── Icon.tsx Universal Icon component
|
|
28
|
-
* ```
|
|
29
|
-
*
|
|
30
|
-
* USAGE:
|
|
31
|
-
* ```typescript
|
|
32
|
-
* import { Icon } from '@domains/icons';
|
|
33
|
-
*
|
|
34
|
-
* // Basic usage
|
|
35
|
-
* <Icon name="Settings" size="md" color="primary" />
|
|
36
|
-
*
|
|
37
|
-
* // Custom size and color
|
|
38
|
-
* <Icon name="Heart" customSize={32} customColor="#FF0000" />
|
|
39
|
-
*
|
|
40
|
-
* // With background
|
|
41
|
-
* <Icon name="Info" size="lg" withBackground backgroundColor="#667eea" />
|
|
42
|
-
* ```
|
|
43
|
-
*
|
|
44
|
-
* 🔧 TO CHANGE ICON LIBRARY:
|
|
45
|
-
*
|
|
46
|
-
* Step 1: Update package.json
|
|
47
|
-
* ```json
|
|
48
|
-
* {
|
|
49
|
-
* "dependencies": {
|
|
50
|
-
* "new-icon-library": "^1.0.0"
|
|
51
|
-
* }
|
|
52
|
-
* }
|
|
53
|
-
* ```
|
|
54
|
-
*
|
|
55
|
-
* Step 2: Change CURRENT_LIBRARY in domain/config/IconLibraryConfig.ts
|
|
56
|
-
* ```typescript
|
|
57
|
-
* export const CURRENT_LIBRARY: IconLibraryType = 'material'; // Changed!
|
|
58
|
-
* ```
|
|
59
|
-
*
|
|
60
|
-
* Step 3: Create adapter (if needed)
|
|
61
|
-
* ```typescript
|
|
62
|
-
* // infrastructure/adapters/MaterialAdapter.ts
|
|
63
|
-
* export const MaterialAdapter: IIconAdapter = {
|
|
64
|
-
* getIconComponent: (name) => MaterialIcons[name],
|
|
65
|
-
* // ... implement interface
|
|
66
|
-
* };
|
|
67
|
-
* ```
|
|
68
|
-
*
|
|
69
|
-
* Step 4: Done! All apps use new library automatically ✅
|
|
70
|
-
*
|
|
71
|
-
* CURRENT LIBRARY: Lucide (1,639 icons)
|
|
72
|
-
* @see https://lucide.dev/icons/
|
|
73
|
-
*
|
|
74
|
-
* DEPENDENCIES:
|
|
75
|
-
* - lucide-react-native: ^0.468.0 (Current library)
|
|
76
|
-
*/
|
|
77
|
-
|
|
78
|
-
// ============================================================================
|
|
79
|
-
// PRESENTATION LAYER - Universal Icon Component
|
|
80
|
-
// ============================================================================
|
|
81
|
-
|
|
82
|
-
export { Icon } from './presentation/components/Icon';
|
|
83
|
-
export type {
|
|
84
|
-
IconProps,
|
|
85
|
-
IconSize,
|
|
86
|
-
IconColor,
|
|
87
|
-
IconName,
|
|
88
|
-
} from './presentation/components/Icon';
|
|
89
|
-
|
|
90
|
-
// ============================================================================
|
|
91
|
-
// DOMAIN LAYER - Configuration & Interfaces
|
|
92
|
-
// ============================================================================
|
|
93
|
-
|
|
94
|
-
export {
|
|
95
|
-
CURRENT_LIBRARY,
|
|
96
|
-
ICON_LIBRARY_CONFIG,
|
|
97
|
-
getCurrentLibrary,
|
|
98
|
-
isLucideLibrary,
|
|
99
|
-
} from './domain/config/IconLibraryConfig';
|
|
100
|
-
export type { IconLibraryType } from './domain/config/IconLibraryConfig';
|
|
101
|
-
|
|
102
|
-
export type { IIconAdapter } from './domain/interfaces/IIconAdapter';
|
|
103
|
-
|
|
104
|
-
// ============================================================================
|
|
105
|
-
// INFRASTRUCTURE LAYER - Adapters
|
|
106
|
-
// ============================================================================
|
|
107
|
-
|
|
108
|
-
export { LucideAdapter } from './infrastructure/adapters/LucideAdapter';
|
|
109
|
-
export type { LucideIconName } from './infrastructure/adapters/LucideAdapter';
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Lucide Icon Library Adapter
|
|
3
|
-
*
|
|
4
|
-
* Adapter for lucide-react-native library (1,639 icons).
|
|
5
|
-
* Implements IIconAdapter interface for seamless library switching.
|
|
6
|
-
*
|
|
7
|
-
* @library lucide-react-native
|
|
8
|
-
* @version ^0.468.0
|
|
9
|
-
* @icons 1,639
|
|
10
|
-
* @type outline
|
|
11
|
-
*
|
|
12
|
-
* @see https://lucide.dev/icons/
|
|
13
|
-
*/
|
|
14
|
-
|
|
15
|
-
import { icons } from 'lucide-react-native';
|
|
16
|
-
import type { IIconAdapter, IconSize, IconColor } from '../../domain/interfaces/IIconAdapter';
|
|
17
|
-
import type { DesignTokens } from '../../../../presentation/tokens/core/TokenFactory';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Size mapping: Semantic → Pixels
|
|
21
|
-
*/
|
|
22
|
-
const SIZE_MAP: Record<IconSize, number> = {
|
|
23
|
-
xs: 16,
|
|
24
|
-
sm: 20,
|
|
25
|
-
md: 24,
|
|
26
|
-
lg: 28,
|
|
27
|
-
xl: 32,
|
|
28
|
-
xxl: 40,
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
* Lucide Adapter Implementation
|
|
33
|
-
*/
|
|
34
|
-
export const LucideAdapter: IIconAdapter = {
|
|
35
|
-
/**
|
|
36
|
-
* Get Lucide icon component by name
|
|
37
|
-
*/
|
|
38
|
-
getIconComponent: (name: string) => {
|
|
39
|
-
const IconComponent = icons[name as keyof typeof icons];
|
|
40
|
-
if (!IconComponent) {
|
|
41
|
-
console.warn(`[LucideAdapter] Icon "${name}" not found in Lucide library`);
|
|
42
|
-
return null;
|
|
43
|
-
}
|
|
44
|
-
return IconComponent;
|
|
45
|
-
},
|
|
46
|
-
|
|
47
|
-
/**
|
|
48
|
-
* Get icon size in pixels
|
|
49
|
-
*/
|
|
50
|
-
getIconSize: (size: IconSize, customSize?: number) => {
|
|
51
|
-
return customSize || SIZE_MAP[size];
|
|
52
|
-
},
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* Get icon color from theme
|
|
56
|
-
*/
|
|
57
|
-
getIconColor: (color: IconColor, tokens: DesignTokens, customColor?: string) => {
|
|
58
|
-
if (customColor) return customColor;
|
|
59
|
-
|
|
60
|
-
const colorMap: Record<IconColor, string> = {
|
|
61
|
-
primary: tokens.colors.primary,
|
|
62
|
-
secondary: tokens.colors.secondary,
|
|
63
|
-
success: tokens.colors.success,
|
|
64
|
-
warning: tokens.colors.warning,
|
|
65
|
-
error: tokens.colors.error,
|
|
66
|
-
info: tokens.colors.info,
|
|
67
|
-
onSurface: tokens.colors.onSurface,
|
|
68
|
-
surfaceVariant: tokens.colors.surfaceVariant,
|
|
69
|
-
onPrimary: tokens.colors.onPrimary,
|
|
70
|
-
onSecondary: tokens.colors.onSecondary,
|
|
71
|
-
textInverse: tokens.colors.textInverse,
|
|
72
|
-
};
|
|
73
|
-
|
|
74
|
-
return colorMap[color];
|
|
75
|
-
},
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* Get all available Lucide icon names
|
|
79
|
-
*/
|
|
80
|
-
getAllIcons: () => {
|
|
81
|
-
return Object.keys(icons);
|
|
82
|
-
},
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* Check if icon exists in Lucide library
|
|
86
|
-
*/
|
|
87
|
-
hasIcon: (name: string) => {
|
|
88
|
-
return name in icons;
|
|
89
|
-
},
|
|
90
|
-
|
|
91
|
-
/**
|
|
92
|
-
* Default stroke width for Lucide outline icons
|
|
93
|
-
*/
|
|
94
|
-
getStrokeWidth: () => 2,
|
|
95
|
-
};
|
|
96
|
-
|
|
97
|
-
/**
|
|
98
|
-
* Lucide icon names type (for TypeScript autocomplete)
|
|
99
|
-
*/
|
|
100
|
-
export type LucideIconName = keyof typeof icons;
|