@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.
Files changed (209) hide show
  1. package/lib/index.d.ts +4 -4
  2. package/lib/index.d.ts.map +1 -1
  3. package/lib/index.js +13 -11
  4. package/lib/index.js.map +1 -1
  5. package/lib/presentation/atoms/AtomicAvatar.js +1 -1
  6. package/lib/presentation/atoms/AtomicAvatar.js.map +1 -1
  7. package/lib/presentation/atoms/AtomicAvatarGroup.js +1 -1
  8. package/lib/presentation/atoms/AtomicAvatarGroup.js.map +1 -1
  9. package/lib/presentation/atoms/AtomicBadge.js +1 -1
  10. package/lib/presentation/atoms/AtomicBadge.js.map +1 -1
  11. package/lib/presentation/atoms/AtomicButton.d.ts +1 -1
  12. package/lib/presentation/atoms/AtomicButton.d.ts.map +1 -1
  13. package/lib/presentation/atoms/AtomicButton.js +2 -2
  14. package/lib/presentation/atoms/AtomicButton.js.map +1 -1
  15. package/lib/presentation/atoms/AtomicCard.js +1 -1
  16. package/lib/presentation/atoms/AtomicCard.js.map +1 -1
  17. package/lib/presentation/atoms/AtomicChip.js +1 -1
  18. package/lib/presentation/atoms/AtomicChip.js.map +1 -1
  19. package/lib/presentation/atoms/AtomicDatePicker.js +1 -1
  20. package/lib/presentation/atoms/AtomicDatePicker.js.map +1 -1
  21. package/lib/presentation/atoms/AtomicDivider.js +1 -1
  22. package/lib/presentation/atoms/AtomicDivider.js.map +1 -1
  23. package/lib/presentation/atoms/AtomicFab.js +1 -1
  24. package/lib/presentation/atoms/AtomicFab.js.map +1 -1
  25. package/lib/presentation/atoms/AtomicFilter.js +1 -1
  26. package/lib/presentation/atoms/AtomicFilter.js.map +1 -1
  27. package/lib/presentation/atoms/AtomicFormError.js +2 -2
  28. package/lib/presentation/atoms/AtomicFormError.js.map +1 -1
  29. package/lib/presentation/atoms/AtomicIcon.d.ts +2 -3
  30. package/lib/presentation/atoms/AtomicIcon.d.ts.map +1 -1
  31. package/lib/presentation/atoms/AtomicIcon.js +1 -1
  32. package/lib/presentation/atoms/AtomicIcon.js.map +1 -1
  33. package/lib/presentation/atoms/AtomicImage.js +1 -1
  34. package/lib/presentation/atoms/AtomicImage.js.map +1 -1
  35. package/lib/presentation/atoms/AtomicInput.js +1 -1
  36. package/lib/presentation/atoms/AtomicInput.js.map +1 -1
  37. package/lib/presentation/atoms/AtomicPicker.js +1 -1
  38. package/lib/presentation/atoms/AtomicPicker.js.map +1 -1
  39. package/lib/presentation/atoms/AtomicProgress.js +1 -1
  40. package/lib/presentation/atoms/AtomicProgress.js.map +1 -1
  41. package/lib/presentation/atoms/AtomicSearchBar.js +1 -1
  42. package/lib/presentation/atoms/AtomicSearchBar.js.map +1 -1
  43. package/lib/presentation/atoms/AtomicSort.js +1 -1
  44. package/lib/presentation/atoms/AtomicSort.js.map +1 -1
  45. package/lib/presentation/atoms/AtomicSwitch.js +1 -1
  46. package/lib/presentation/atoms/AtomicSwitch.js.map +1 -1
  47. package/lib/presentation/atoms/AtomicText.d.ts +21 -1
  48. package/lib/presentation/atoms/AtomicText.d.ts.map +1 -1
  49. package/lib/presentation/atoms/AtomicText.js +33 -10
  50. package/lib/presentation/atoms/AtomicText.js.map +1 -1
  51. package/lib/presentation/atoms/AtomicTextArea.js +1 -1
  52. package/lib/presentation/atoms/AtomicTextArea.js.map +1 -1
  53. package/lib/presentation/atoms/AtomicTouchable.js +1 -1
  54. package/lib/presentation/atoms/AtomicTouchable.js.map +1 -1
  55. package/lib/presentation/atoms/fab/styles/fabStyles.d.ts +1 -1
  56. package/lib/presentation/atoms/fab/styles/fabStyles.d.ts.map +1 -1
  57. package/lib/presentation/atoms/index.d.ts +1 -1
  58. package/lib/presentation/atoms/input/styles/inputStyles.d.ts +1 -1
  59. package/lib/presentation/atoms/input/styles/inputStyles.d.ts.map +1 -1
  60. package/lib/presentation/atoms/picker/styles/pickerStyles.d.ts +12 -23
  61. package/lib/presentation/atoms/picker/styles/pickerStyles.d.ts.map +1 -1
  62. package/lib/presentation/atoms/picker/styles/pickerStyles.js.map +1 -1
  63. package/lib/presentation/molecules/AtomicConfirmationModal.js +1 -1
  64. package/lib/presentation/molecules/AtomicConfirmationModal.js.map +1 -1
  65. package/lib/presentation/molecules/EmptyState.js +1 -1
  66. package/lib/presentation/molecules/EmptyState.js.map +1 -1
  67. package/lib/presentation/molecules/FormField.js +1 -1
  68. package/lib/presentation/molecules/FormField.js.map +1 -1
  69. package/lib/presentation/molecules/IconContainer.js +1 -1
  70. package/lib/presentation/molecules/IconContainer.js.map +1 -1
  71. package/lib/presentation/molecules/ListItem.js +1 -1
  72. package/lib/presentation/molecules/ListItem.js.map +1 -1
  73. package/lib/presentation/molecules/ScreenHeader.js +1 -1
  74. package/lib/presentation/molecules/ScreenHeader.js.map +1 -1
  75. package/lib/presentation/molecules/SearchBar.js +1 -1
  76. package/lib/presentation/molecules/SearchBar.js.map +1 -1
  77. package/lib/presentation/molecules/SectionCard.js +1 -1
  78. package/lib/presentation/molecules/SectionCard.js.map +1 -1
  79. package/lib/presentation/molecules/SectionContainer.js +1 -1
  80. package/lib/presentation/molecules/SectionContainer.js.map +1 -1
  81. package/lib/presentation/molecules/SectionHeader.js +1 -1
  82. package/lib/presentation/molecules/SectionHeader.js.map +1 -1
  83. package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.d.ts +1 -1
  84. package/lib/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.d.ts.map +1 -1
  85. package/lib/presentation/molecules/listitem/styles/listItemStyles.d.ts +1 -1
  86. package/lib/presentation/molecules/listitem/styles/listItemStyles.d.ts.map +1 -1
  87. package/lib/presentation/organisms/AppHeader.d.ts +3 -2
  88. package/lib/presentation/organisms/AppHeader.d.ts.map +1 -1
  89. package/lib/presentation/organisms/AppHeader.js +1 -1
  90. package/lib/presentation/organisms/AppHeader.js.map +1 -1
  91. package/lib/presentation/organisms/FormContainer.js +1 -1
  92. package/lib/presentation/organisms/FormContainer.js.map +1 -1
  93. package/lib/presentation/organisms/ScreenLayout.js +1 -1
  94. package/lib/presentation/organisms/ScreenLayout.js.map +1 -1
  95. package/lib/presentation/tokens/commonStyles.js +1 -1
  96. package/lib/presentation/tokens/commonStyles.js.map +1 -1
  97. package/package.json +1 -1
  98. package/src/index.ts +16 -16
  99. package/src/presentation/atoms/AtomicAvatar.tsx +1 -1
  100. package/src/presentation/atoms/AtomicAvatarGroup.tsx +1 -1
  101. package/src/presentation/atoms/AtomicBadge.tsx +2 -2
  102. package/src/presentation/atoms/AtomicButton.tsx +3 -3
  103. package/src/presentation/atoms/AtomicCard.tsx +1 -1
  104. package/src/presentation/atoms/AtomicChip.tsx +1 -1
  105. package/src/presentation/atoms/AtomicDatePicker.tsx +1 -1
  106. package/src/presentation/atoms/AtomicDivider.tsx +1 -1
  107. package/src/presentation/atoms/AtomicFab.tsx +1 -1
  108. package/src/presentation/atoms/AtomicFilter.tsx +1 -1
  109. package/src/presentation/atoms/AtomicFormError.tsx +2 -2
  110. package/src/presentation/atoms/AtomicIcon.tsx +3 -4
  111. package/src/presentation/atoms/AtomicImage.tsx +1 -1
  112. package/src/presentation/atoms/AtomicInput.tsx +1 -1
  113. package/src/presentation/atoms/AtomicPicker.tsx +1 -1
  114. package/src/presentation/atoms/AtomicProgress.tsx +1 -1
  115. package/src/presentation/atoms/AtomicSearchBar.tsx +1 -1
  116. package/src/presentation/atoms/AtomicSort.tsx +1 -1
  117. package/src/presentation/atoms/AtomicSwitch.tsx +1 -1
  118. package/src/presentation/atoms/AtomicText.tsx +83 -13
  119. package/src/presentation/atoms/AtomicTextArea.tsx +1 -1
  120. package/src/presentation/atoms/AtomicTouchable.tsx +1 -1
  121. package/src/presentation/atoms/fab/styles/fabStyles.ts +1 -1
  122. package/src/presentation/atoms/input/styles/inputStyles.ts +1 -1
  123. package/src/presentation/atoms/picker/styles/pickerStyles.ts +13 -6
  124. package/src/presentation/molecules/AtomicConfirmationModal.tsx +1 -1
  125. package/src/presentation/molecules/EmptyState.tsx +1 -1
  126. package/src/presentation/molecules/FormField.tsx +1 -1
  127. package/src/presentation/molecules/IconContainer.tsx +1 -1
  128. package/src/presentation/molecules/ListItem.tsx +1 -1
  129. package/src/presentation/molecules/ScreenHeader.tsx +1 -1
  130. package/src/presentation/molecules/SearchBar.tsx +1 -1
  131. package/src/presentation/molecules/SectionCard.tsx +1 -1
  132. package/src/presentation/molecules/SectionContainer.tsx +1 -1
  133. package/src/presentation/molecules/SectionHeader.tsx +1 -1
  134. package/src/presentation/molecules/confirmation-modal/styles/confirmationModalStyles.ts +1 -1
  135. package/src/presentation/molecules/listitem/styles/listItemStyles.ts +1 -1
  136. package/src/presentation/organisms/AppHeader.tsx +4 -3
  137. package/src/presentation/organisms/FormContainer.tsx +1 -1
  138. package/src/presentation/organisms/ScreenLayout.tsx +1 -1
  139. package/src/presentation/tokens/commonStyles.ts +1 -1
  140. package/lib/domains/icons/domain/config/IconLibraryConfig.d.ts +0 -91
  141. package/lib/domains/icons/domain/config/IconLibraryConfig.d.ts.map +0 -1
  142. package/lib/domains/icons/domain/config/IconLibraryConfig.js +0 -85
  143. package/lib/domains/icons/domain/config/IconLibraryConfig.js.map +0 -1
  144. package/lib/domains/icons/domain/entities/Icon.d.ts +0 -111
  145. package/lib/domains/icons/domain/entities/Icon.d.ts.map +0 -1
  146. package/lib/domains/icons/domain/entities/Icon.js +0 -87
  147. package/lib/domains/icons/domain/entities/Icon.js.map +0 -1
  148. package/lib/domains/icons/domain/interfaces/IIconAdapter.d.ts +0 -114
  149. package/lib/domains/icons/domain/interfaces/IIconAdapter.d.ts.map +0 -1
  150. package/lib/domains/icons/domain/interfaces/IIconAdapter.js +0 -17
  151. package/lib/domains/icons/domain/interfaces/IIconAdapter.js.map +0 -1
  152. package/lib/domains/icons/index.d.ts +0 -84
  153. package/lib/domains/icons/index.d.ts.map +0 -1
  154. package/lib/domains/icons/index.js +0 -89
  155. package/lib/domains/icons/index.js.map +0 -1
  156. package/lib/domains/icons/infrastructure/adapters/LucideAdapter.d.ts +0 -24
  157. package/lib/domains/icons/infrastructure/adapters/LucideAdapter.d.ts.map +0 -1
  158. package/lib/domains/icons/infrastructure/adapters/LucideAdapter.js +0 -85
  159. package/lib/domains/icons/infrastructure/adapters/LucideAdapter.js.map +0 -1
  160. package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.d.ts +0 -23
  161. package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.d.ts.map +0 -1
  162. package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.js +0 -178
  163. package/lib/domains/icons/infrastructure/registries/ExpoIconRegistry.js.map +0 -1
  164. package/lib/domains/icons/presentation/components/Icon.d.ts +0 -42
  165. package/lib/domains/icons/presentation/components/Icon.d.ts.map +0 -1
  166. package/lib/domains/icons/presentation/components/Icon.js +0 -86
  167. package/lib/domains/icons/presentation/components/Icon.js.map +0 -1
  168. package/lib/domains/icons/presentation/hooks/useIconLibrary.d.ts +0 -38
  169. package/lib/domains/icons/presentation/hooks/useIconLibrary.d.ts.map +0 -1
  170. package/lib/domains/icons/presentation/hooks/useIconLibrary.js +0 -114
  171. package/lib/domains/icons/presentation/hooks/useIconLibrary.js.map +0 -1
  172. package/lib/infrastructure/theme/globalThemeStore.d.ts +0 -42
  173. package/lib/infrastructure/theme/globalThemeStore.d.ts.map +0 -1
  174. package/lib/infrastructure/theme/globalThemeStore.js +0 -38
  175. package/lib/infrastructure/theme/globalThemeStore.js.map +0 -1
  176. package/lib/presentation/hooks/useAppDesignTokens.d.ts +0 -34
  177. package/lib/presentation/hooks/useAppDesignTokens.d.ts.map +0 -1
  178. package/lib/presentation/hooks/useAppDesignTokens.js +0 -39
  179. package/lib/presentation/hooks/useAppDesignTokens.js.map +0 -1
  180. package/lib/presentation/tokens/AppDesignTokens.d.ts +0 -14
  181. package/lib/presentation/tokens/AppDesignTokens.d.ts.map +0 -1
  182. package/lib/presentation/tokens/AppDesignTokens.js +0 -23
  183. package/lib/presentation/tokens/AppDesignTokens.js.map +0 -1
  184. package/lib/presentation/tokens/core/BaseTokens.d.ts +0 -312
  185. package/lib/presentation/tokens/core/BaseTokens.d.ts.map +0 -1
  186. package/lib/presentation/tokens/core/BaseTokens.js +0 -304
  187. package/lib/presentation/tokens/core/BaseTokens.js.map +0 -1
  188. package/lib/presentation/tokens/core/ColorPalette.d.ts +0 -216
  189. package/lib/presentation/tokens/core/ColorPalette.d.ts.map +0 -1
  190. package/lib/presentation/tokens/core/ColorPalette.js +0 -330
  191. package/lib/presentation/tokens/core/ColorPalette.js.map +0 -1
  192. package/lib/presentation/tokens/core/TokenFactory.d.ts +0 -216
  193. package/lib/presentation/tokens/core/TokenFactory.d.ts.map +0 -1
  194. package/lib/presentation/tokens/core/TokenFactory.js +0 -86
  195. package/lib/presentation/tokens/core/TokenFactory.js.map +0 -1
  196. package/src/domains/icons/domain/config/IconLibraryConfig.ts +0 -93
  197. package/src/domains/icons/domain/entities/Icon.ts +0 -143
  198. package/src/domains/icons/domain/interfaces/IIconAdapter.ts +0 -147
  199. package/src/domains/icons/index.ts +0 -109
  200. package/src/domains/icons/infrastructure/adapters/LucideAdapter.ts +0 -100
  201. package/src/domains/icons/infrastructure/registries/ExpoIconRegistry.ts +0 -191
  202. package/src/domains/icons/presentation/components/Icon.tsx +0 -132
  203. package/src/domains/icons/presentation/hooks/useIconLibrary.ts +0 -141
  204. package/src/infrastructure/theme/globalThemeStore.ts +0 -51
  205. package/src/presentation/hooks/useAppDesignTokens.ts +0 -40
  206. package/src/presentation/tokens/AppDesignTokens.ts +0 -55
  207. package/src/presentation/tokens/core/BaseTokens.ts +0 -372
  208. package/src/presentation/tokens/core/ColorPalette.ts +0 -400
  209. package/src/presentation/tokens/core/TokenFactory.ts +0 -118
@@ -16,7 +16,7 @@
16
16
 
17
17
  import React from 'react';
18
18
  import { View, StyleSheet, ViewStyle, DimensionValue, Text } from 'react-native';
19
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
19
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
20
20
 
21
21
  // =============================================================================
22
22
  // TYPE DEFINITIONS
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { View, TextInput, TouchableOpacity, StyleSheet } from 'react-native';
3
3
  import type { StyleProp, ViewStyle, TextStyle } from 'react-native';
4
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
4
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
5
5
  import { AtomicIcon } from './AtomicIcon';
6
6
 
7
7
  export interface AtomicSearchBarProps {
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { ScrollView, View } from 'react-native';
3
3
  import type { StyleProp, ViewStyle } from 'react-native';
4
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
4
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
5
5
  import { AtomicChip } from './AtomicChip';
6
6
 
7
7
  /**
@@ -16,7 +16,7 @@
16
16
 
17
17
  import React from 'react';
18
18
  import { Switch, SwitchProps, StyleSheet, ViewStyle } from 'react-native';
19
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
19
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
20
20
 
21
21
  // =============================================================================
22
22
  // TYPE DEFINITIONS
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { Text, StyleProp, TextStyle } from 'react-native';
3
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
3
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
4
4
 
5
5
  export type TextStyleVariant =
6
6
  | 'displayLarge' | 'displayMedium' | 'displaySmall'
@@ -9,22 +9,62 @@ export type TextStyleVariant =
9
9
  | 'bodyLarge' | 'bodyMedium' | 'bodySmall'
10
10
  | 'labelLarge' | 'labelMedium' | 'labelSmall';
11
11
 
12
+ /**
13
+ * Material Design 3 Text Color Variants
14
+ *
15
+ * TEXT COLORS (for text on surfaces):
16
+ * - textPrimary, textSecondary, textTertiary: General text colors
17
+ * - onSurface, onBackground: Text on surface/background
18
+ *
19
+ * ON COLORS (for text on colored backgrounds):
20
+ * - onPrimary, onSecondary: Text on primary/secondary colored backgrounds
21
+ * - onSuccess, onError, onWarning, onInfo: Text on semantic colored backgrounds
22
+ *
23
+ * SEMANTIC COLORS (can be used as text colors):
24
+ * - success, error, warning, info: Semantic colors (can be text or background)
25
+ *
26
+ * NOTE: 'primary' and 'secondary' are BACKGROUND colors, not text colors.
27
+ * Use 'onPrimary'/'onSecondary' for text on colored backgrounds, or
28
+ * 'textPrimary'/'textSecondary' for general text.
29
+ */
12
30
  export type ColorVariant =
31
+ // General text colors (Material Design 3)
32
+ | 'textPrimary'
33
+ | 'textSecondary'
34
+ | 'textTertiary'
35
+ | 'textDisabled'
36
+ | 'textInverse'
37
+ // Text on surfaces (Material Design 3)
38
+ | 'onSurface'
39
+ | 'onBackground'
40
+ // Text on colored backgrounds (Material Design 3)
41
+ | 'onPrimary'
42
+ | 'onSecondary'
43
+ | 'onSuccess'
44
+ | 'onError'
45
+ | 'onWarning'
46
+ | 'onInfo'
47
+ // Semantic colors (can be used as text)
48
+ | 'success'
49
+ | 'error'
50
+ | 'warning'
51
+ | 'info'
52
+ // Legacy support (deprecated - use textPrimary/textSecondary instead)
13
53
  | 'primary'
14
54
  | 'secondary'
15
55
  | 'tertiary'
16
56
  | 'disabled'
17
57
  | 'inverse'
18
- | 'success'
19
- | 'error'
20
- | 'warning'
21
- | 'info';
58
+ // Legacy: surfaceVariant is a background color, maps to textSecondary
59
+ | 'surfaceVariant';
22
60
 
23
61
  export interface AtomicTextProps {
24
62
  children: React.ReactNode;
25
63
  type?: TextStyleVariant;
26
64
  color?: ColorVariant | string;
27
65
  numberOfLines?: number;
66
+ ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';
67
+ textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify';
28
68
  style?: StyleProp<TextStyle>;
29
69
  testID?: string;
30
70
  }
@@ -34,6 +74,8 @@ export const AtomicText: React.FC<AtomicTextProps> = ({
34
74
  type = 'bodyMedium',
35
75
  color,
36
76
  numberOfLines,
77
+ ellipsizeMode,
78
+ textAlign,
37
79
  style,
38
80
  testID,
39
81
  }) => {
@@ -48,17 +90,41 @@ export const AtomicText: React.FC<AtomicTextProps> = ({
48
90
  return tokens.colors.textPrimary;
49
91
  }
50
92
 
51
- // Check if it's a semantic color name
52
- const colorMap: Record<ColorVariant, string> = {
53
- primary: tokens.colors.textPrimary,
54
- secondary: tokens.colors.textSecondary,
55
- tertiary: tokens.colors.textTertiary,
56
- disabled: tokens.colors.textDisabled,
57
- inverse: tokens.colors.textInverse,
93
+ // Material Design 3 text color mapping
94
+ const colorMap: Partial<Record<ColorVariant, string>> = {
95
+ // General text colors (Material Design 3)
96
+ textPrimary: tokens.colors.textPrimary,
97
+ textSecondary: tokens.colors.textSecondary,
98
+ textTertiary: tokens.colors.textTertiary,
99
+ textDisabled: tokens.colors.textDisabled,
100
+ textInverse: tokens.colors.textInverse,
101
+
102
+ // Text on surfaces (Material Design 3)
103
+ onSurface: tokens.colors.onSurface,
104
+ onBackground: tokens.colors.onBackground,
105
+
106
+ // Text on colored backgrounds (Material Design 3)
107
+ onPrimary: tokens.colors.onPrimary,
108
+ onSecondary: tokens.colors.onSecondary,
109
+ onSuccess: tokens.colors.onSuccess,
110
+ onError: tokens.colors.onError,
111
+ onWarning: tokens.colors.onWarning,
112
+ onInfo: tokens.colors.onInfo,
113
+
114
+ // Semantic colors (can be used as text)
58
115
  success: tokens.colors.success,
59
116
  error: tokens.colors.error,
60
117
  warning: tokens.colors.warning,
61
118
  info: tokens.colors.info,
119
+
120
+ // Legacy support (deprecated - maps to new names)
121
+ primary: tokens.colors.textPrimary, // Legacy: use textPrimary or onPrimary
122
+ secondary: tokens.colors.textSecondary, // Legacy: use textSecondary or onSecondary
123
+ tertiary: tokens.colors.textTertiary, // Legacy: use textTertiary
124
+ disabled: tokens.colors.textDisabled, // Legacy: use textDisabled
125
+ inverse: tokens.colors.textInverse, // Legacy: use textInverse
126
+ // Legacy: surfaceVariant is a background color, but used as text - map to textSecondary
127
+ surfaceVariant: tokens.colors.textSecondary, // Legacy: use textSecondary instead
62
128
  };
63
129
 
64
130
  return colorMap[color as ColorVariant] || color;
@@ -66,13 +132,17 @@ export const AtomicText: React.FC<AtomicTextProps> = ({
66
132
 
67
133
  const textStyle: StyleProp<TextStyle> = [
68
134
  typographyStyle,
69
- { color: getTextColor() },
135
+ {
136
+ color: getTextColor(),
137
+ ...(textAlign && { textAlign }),
138
+ },
70
139
  style,
71
140
  ];
72
141
 
73
142
  return (
74
143
  <Text
75
144
  numberOfLines={numberOfLines}
145
+ ellipsizeMode={ellipsizeMode}
76
146
  style={textStyle}
77
147
  testID={testID}
78
148
  >
@@ -33,7 +33,7 @@
33
33
 
34
34
  import React, { useState } from 'react';
35
35
  import { View, TextInput, StyleSheet, StyleProp, ViewStyle, TextStyle } from 'react-native';
36
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
36
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
37
37
  import { AtomicText } from './AtomicText';
38
38
 
39
39
  export type AtomicTextAreaVariant = 'outlined' | 'filled' | 'flat';
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { Pressable } from 'react-native';
3
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
3
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
4
4
  import { AtomicTouchableProps, TouchableFeedback, FeedbackStrength } from './touchable/types';
5
5
  import {
6
6
  getOpacityValue,
@@ -1,6 +1,6 @@
1
1
  import { ViewStyle } from 'react-native';
2
2
  import { FabVariant, FabSize, FabVariantConfig, FabSizeConfig } from '../types';
3
- import type { DesignTokens } from '../../../tokens/AppDesignTokens';
3
+ import type { DesignTokens } from '@umituz/react-native-theme';
4
4
 
5
5
  /**
6
6
  * Material Design 3 FAB size configurations
@@ -1,5 +1,5 @@
1
1
  import { ViewStyle, TextStyle } from 'react-native';
2
- import { useAppDesignTokens } from '../../../hooks/useAppDesignTokens';
2
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
3
3
  import { AtomicInputVariant, AtomicInputSize, AtomicInputState } from '../types';
4
4
 
5
5
  type DesignTokens = ReturnType<typeof useAppDesignTokens>;
@@ -1,10 +1,8 @@
1
1
  import { ViewStyle, TextStyle } from 'react-native';
2
- import { useAppDesignTokens } from '../../../hooks/useAppDesignTokens';
2
+ import { useAppDesignTokens, type DesignTokens } from '@umituz/react-native-theme';
3
3
  import { PickerSize } from '../types';
4
4
  import { IOS_HIG, getMinTouchTarget } from '../../../utils/platformConstants';
5
5
 
6
- type DesignTokens = ReturnType<typeof useAppDesignTokens>;
7
-
8
6
  /**
9
7
  * Picker container styles with iOS HIG compliance
10
8
  *
@@ -50,7 +48,10 @@ export const getPickerContainerStyles = (tokens: DesignTokens) => ({
50
48
  },
51
49
  });
52
50
 
53
- export const getPickerLabelStyles = (tokens: DesignTokens) => ({
51
+ export const getPickerLabelStyles = (tokens: DesignTokens): {
52
+ base: TextStyle;
53
+ size: { sm: TextStyle; md: TextStyle; lg: TextStyle };
54
+ } => ({
54
55
  base: {
55
56
  marginBottom: tokens.spacing.xs,
56
57
  color: tokens.colors.textPrimary,
@@ -63,7 +64,10 @@ export const getPickerLabelStyles = (tokens: DesignTokens) => ({
63
64
  },
64
65
  });
65
66
 
66
- export const getPickerPlaceholderStyles = (tokens: DesignTokens) => ({
67
+ export const getPickerPlaceholderStyles = (tokens: DesignTokens): {
68
+ base: TextStyle;
69
+ size: { sm: TextStyle; md: TextStyle; lg: TextStyle };
70
+ } => ({
67
71
  base: {
68
72
  color: tokens.colors.textSecondary,
69
73
  },
@@ -74,7 +78,10 @@ export const getPickerPlaceholderStyles = (tokens: DesignTokens) => ({
74
78
  },
75
79
  });
76
80
 
77
- export const getPickerValueStyles = (tokens: DesignTokens) => ({
81
+ export const getPickerValueStyles = (tokens: DesignTokens): {
82
+ base: TextStyle;
83
+ size: { sm: TextStyle; md: TextStyle; lg: TextStyle };
84
+ } => ({
78
85
  base: {
79
86
  flex: 1,
80
87
  color: tokens.colors.textPrimary,
@@ -39,7 +39,7 @@
39
39
 
40
40
  import React from 'react';
41
41
  import { View, Modal, TouchableOpacity } from 'react-native';
42
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
42
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
43
43
  import { AtomicText } from '../atoms/AtomicText';
44
44
  import { AtomicButton } from '../atoms/AtomicButton';
45
45
  import { AtomicIcon } from '../atoms/AtomicIcon';
@@ -17,7 +17,7 @@
17
17
  import React from 'react';
18
18
  import { View, StyleSheet, ViewStyle, TextStyle } from 'react-native';
19
19
  import { AtomicText, AtomicIcon } from '../atoms';
20
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
20
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
21
21
 
22
22
  // =============================================================================
23
23
  // TYPE DEFINITIONS
@@ -10,7 +10,7 @@
10
10
 
11
11
  import React from 'react';
12
12
  import { View, ViewStyle } from 'react-native';
13
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
13
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
14
14
  import { AtomicText } from '../atoms/AtomicText';
15
15
  import { AtomicInput, AtomicInputProps } from '../atoms/AtomicInput';
16
16
 
@@ -16,7 +16,7 @@
16
16
 
17
17
  import React from 'react';
18
18
  import { View, StyleSheet } from 'react-native';
19
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
19
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
20
20
  import { LinearGradient } from 'expo-linear-gradient';
21
21
 
22
22
  interface IconContainerProps {
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { TouchableOpacity, View } from 'react-native';
3
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
3
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
4
4
  import { AtomicText } from '../atoms/AtomicText';
5
5
  import { AtomicIcon } from '../atoms/AtomicIcon';
6
6
  import { ListItemProps } from './listitem/types';
@@ -19,7 +19,7 @@ import { View, StyleSheet, TouchableOpacity, ViewStyle } from 'react-native';
19
19
  import { useNavigation } from '@react-navigation/native';
20
20
  import { AtomicIcon } from '../atoms/AtomicIcon';
21
21
  import { AtomicText } from '../atoms/AtomicText';
22
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
22
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
23
23
 
24
24
  export interface ScreenHeaderProps {
25
25
  /** Screen title (centered) */
@@ -10,7 +10,7 @@
10
10
 
11
11
  import React from 'react';
12
12
  import { View, TouchableOpacity, ViewStyle } from 'react-native';
13
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
13
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
14
14
  import { AtomicInput, AtomicInputProps } from '../atoms/AtomicInput';
15
15
  import { AtomicIcon } from '../atoms/AtomicIcon';
16
16
 
@@ -15,7 +15,7 @@
15
15
 
16
16
  import React from 'react';
17
17
  import { View, StyleSheet } from 'react-native';
18
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
18
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
19
19
  import { AtomicCard } from '../atoms/AtomicCard';
20
20
  import { AtomicText } from '../atoms/AtomicText';
21
21
 
@@ -17,7 +17,7 @@
17
17
  import React from 'react';
18
18
  import { View, StyleSheet, ViewStyle, TextStyle } from 'react-native';
19
19
  import { AtomicText } from '../atoms/AtomicText';
20
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
20
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
21
21
 
22
22
  // =============================================================================
23
23
  // TYPE DEFINITIONS
@@ -17,7 +17,7 @@
17
17
  import React from 'react';
18
18
  import { View, StyleSheet, ViewStyle, TextStyle } from 'react-native';
19
19
  import { AtomicText } from '../atoms/AtomicText';
20
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
20
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
21
21
 
22
22
  // =============================================================================
23
23
  // TYPE DEFINITIONS
@@ -6,7 +6,7 @@
6
6
 
7
7
  import { ViewStyle } from 'react-native';
8
8
  import { ConfirmationModalVariant, ConfirmationModalVariantConfig } from '../types';
9
- import type { DesignTokens } from '../../../tokens/AppDesignTokens';
9
+ import type { DesignTokens } from '@umituz/react-native-theme';
10
10
 
11
11
  /**
12
12
  * Get variant configuration (icon and color only)
@@ -1,5 +1,5 @@
1
1
  import { ViewStyle } from 'react-native';
2
- import { useAppDesignTokens } from '../../../hooks/useAppDesignTokens';
2
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
3
3
 
4
4
  type DesignTokens = ReturnType<typeof useAppDesignTokens>;
5
5
 
@@ -10,10 +10,11 @@
10
10
 
11
11
  import React from 'react';
12
12
  import { View, ViewStyle, SafeAreaView } from 'react-native';
13
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
13
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
14
14
  import { AtomicText } from '../atoms/AtomicText';
15
15
  import { AtomicButton } from '../atoms/AtomicButton';
16
16
  import { AtomicIcon } from '../atoms/AtomicIcon';
17
+ import type { IconName } from '@umituz/react-native-icon';
17
18
 
18
19
  // =============================================================================
19
20
  // TYPE DEFINITIONS
@@ -28,9 +29,9 @@ import { AtomicIcon } from '../atoms/AtomicIcon';
28
29
  export interface AppHeaderProps {
29
30
  title: string;
30
31
  subtitle?: string;
31
- leftIcon?: string; // MaterialIcons name
32
+ leftIcon?: IconName;
32
33
  onLeftPress?: () => void;
33
- rightIcon?: string; // MaterialIcons name
34
+ rightIcon?: IconName;
34
35
  onRightPress?: () => void;
35
36
  showShadow?: boolean;
36
37
  backgroundColor?: string;
@@ -52,7 +52,7 @@ import {
52
52
  ViewStyle,
53
53
  } from 'react-native';
54
54
  import { useSafeAreaInsets } from 'react-native-safe-area-context';
55
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
55
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
56
56
  import { useResponsive } from '../hooks/useResponsive';
57
57
 
58
58
  /**
@@ -26,7 +26,7 @@
26
26
  import React, { useMemo } from 'react';
27
27
  import { View, ScrollView, StyleSheet, ViewStyle } from 'react-native';
28
28
  import { SafeAreaView, Edge } from 'react-native-safe-area-context';
29
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
29
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
30
30
 
31
31
  export interface ScreenLayoutProps {
32
32
  /**
@@ -16,7 +16,7 @@
16
16
  */
17
17
 
18
18
  import { ViewStyle, TextStyle } from 'react-native';
19
- import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
19
+ import { useAppDesignTokens } from '@umituz/react-native-theme';
20
20
 
21
21
  /**
22
22
  * Hook to get common styles with dynamic theme support
@@ -1,91 +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
- export type IconLibraryType = 'lucide' | 'material' | 'fontawesome' | 'ionicons';
17
- /**
18
- * 🔧 CHANGE THIS TO SWITCH ICON LIBRARY
19
- */
20
- export declare const CURRENT_LIBRARY: IconLibraryType;
21
- /**
22
- * Icon Library Configuration
23
- */
24
- export declare const ICON_LIBRARY_CONFIG: {
25
- /**
26
- * Current icon library in use
27
- */
28
- readonly library: "lucide";
29
- /**
30
- * Default icon size (in pixels)
31
- */
32
- readonly defaultSize: 24;
33
- /**
34
- * Default stroke width for outline icons
35
- */
36
- readonly defaultStrokeWidth: 2;
37
- /**
38
- * Library metadata
39
- */
40
- readonly libraries: {
41
- readonly lucide: {
42
- readonly name: "Lucide";
43
- readonly package: "lucide-react-native";
44
- readonly version: "^0.468.0";
45
- readonly iconCount: 1639;
46
- readonly type: "outline";
47
- readonly adapter: "LucideAdapter";
48
- };
49
- readonly material: {
50
- readonly name: "Material Icons";
51
- readonly package: "@expo/vector-icons";
52
- readonly version: "^14.0.0";
53
- readonly iconCount: 2000;
54
- readonly type: "filled";
55
- readonly adapter: "MaterialAdapter";
56
- };
57
- readonly fontawesome: {
58
- readonly name: "Font Awesome";
59
- readonly package: "@expo/vector-icons";
60
- readonly version: "^14.0.0";
61
- readonly iconCount: 1500;
62
- readonly type: "solid";
63
- readonly adapter: "FontAwesomeAdapter";
64
- };
65
- readonly ionicons: {
66
- readonly name: "Ionicons";
67
- readonly package: "@expo/vector-icons";
68
- readonly version: "^14.0.0";
69
- readonly iconCount: 1300;
70
- readonly type: "outline";
71
- readonly adapter: "IoniconsAdapter";
72
- };
73
- };
74
- };
75
- /**
76
- * Get current library metadata
77
- */
78
- export declare const getCurrentLibrary: () => {
79
- readonly name: "Lucide";
80
- readonly package: "lucide-react-native";
81
- readonly version: "^0.468.0";
82
- readonly iconCount: 1639;
83
- readonly type: "outline";
84
- readonly adapter: "LucideAdapter";
85
- };
86
- /**
87
- * Type-safe library check
88
- * Factory uses Lucide icons only
89
- */
90
- export declare const isLucideLibrary: () => boolean;
91
- //# sourceMappingURL=IconLibraryConfig.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"IconLibraryConfig.d.ts","sourceRoot":"","sources":["../../../../../src/domains/icons/domain/config/IconLibraryConfig.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,aAAa,GAAG,UAAU,CAAC;AAEjF;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,eAA0B,CAAC;AAEzD;;GAEG;AACH,eAAO,MAAM,mBAAmB;IAC9B;;OAEG;;IAGH;;OAEG;;IAGH;;OAEG;;IAGH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCK,CAAC;AAEX;;GAEG;AACH,eAAO,MAAM,iBAAiB;;;;;;;CAE7B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,eAAa,CAAC"}
@@ -1,85 +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
- * 🔧 CHANGE THIS TO SWITCH ICON LIBRARY
18
- */
19
- export const CURRENT_LIBRARY = 'lucide';
20
- /**
21
- * Icon Library Configuration
22
- */
23
- export const ICON_LIBRARY_CONFIG = {
24
- /**
25
- * Current icon library in use
26
- */
27
- library: CURRENT_LIBRARY,
28
- /**
29
- * Default icon size (in pixels)
30
- */
31
- defaultSize: 24,
32
- /**
33
- * Default stroke width for outline icons
34
- */
35
- defaultStrokeWidth: 2,
36
- /**
37
- * Library metadata
38
- */
39
- libraries: {
40
- lucide: {
41
- name: 'Lucide',
42
- package: 'lucide-react-native',
43
- version: '^0.468.0',
44
- iconCount: 1639,
45
- type: 'outline',
46
- adapter: 'LucideAdapter',
47
- },
48
- material: {
49
- name: 'Material Icons',
50
- package: '@expo/vector-icons',
51
- version: '^14.0.0',
52
- iconCount: 2000,
53
- type: 'filled',
54
- adapter: 'MaterialAdapter',
55
- },
56
- fontawesome: {
57
- name: 'Font Awesome',
58
- package: '@expo/vector-icons',
59
- version: '^14.0.0',
60
- iconCount: 1500,
61
- type: 'solid',
62
- adapter: 'FontAwesomeAdapter',
63
- },
64
- ionicons: {
65
- name: 'Ionicons',
66
- package: '@expo/vector-icons',
67
- version: '^14.0.0',
68
- iconCount: 1300,
69
- type: 'outline',
70
- adapter: 'IoniconsAdapter',
71
- },
72
- },
73
- };
74
- /**
75
- * Get current library metadata
76
- */
77
- export const getCurrentLibrary = () => {
78
- return ICON_LIBRARY_CONFIG.libraries[CURRENT_LIBRARY];
79
- };
80
- /**
81
- * Type-safe library check
82
- * Factory uses Lucide icons only
83
- */
84
- export const isLucideLibrary = () => true;
85
- //# sourceMappingURL=IconLibraryConfig.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"IconLibraryConfig.js","sourceRoot":"","sources":["../../../../../src/domains/icons/domain/config/IconLibraryConfig.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAoB,QAAQ,CAAC;AAEzD;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC;;OAEG;IACH,OAAO,EAAE,eAAe;IAExB;;OAEG;IACH,WAAW,EAAE,EAAE;IAEf;;OAEG;IACH,kBAAkB,EAAE,CAAC;IAErB;;OAEG;IACH,SAAS,EAAE;QACT,MAAM,EAAE;YACN,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,qBAAqB;YAC9B,OAAO,EAAE,UAAU;YACnB,SAAS,EAAE,IAAI;YACf,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,eAAe;SACzB;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,gBAAgB;YACtB,OAAO,EAAE,oBAAoB;YAC7B,OAAO,EAAE,SAAS;YAClB,SAAS,EAAE,IAAI;YACf,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,iBAAiB;SAC3B;QACD,WAAW,EAAE;YACX,IAAI,EAAE,cAAc;YACpB,OAAO,EAAE,oBAAoB;YAC7B,OAAO,EAAE,SAAS;YAClB,SAAS,EAAE,IAAI;YACf,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,oBAAoB;SAC9B;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,oBAAoB;YAC7B,OAAO,EAAE,SAAS;YAClB,SAAS,EAAE,IAAI;YACf,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,iBAAiB;SAC3B;KACF;CACO,CAAC;AAEX;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,OAAO,mBAAmB,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;AACxD,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC"}