@umituz/react-native-design-system 2.6.106 → 2.6.107

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 (7) hide show
  1. package/package.json +1 -1
  2. package/src/atoms/EmptyState.tsx +6 -7
  3. package/src/atoms/button/styles/buttonStyles.ts +2 -2
  4. package/src/atoms/card/AtomicCard.tsx +3 -1
  5. package/src/layouts/ScreenLayout/styles/screenLayoutStyles.ts +1 -1
  6. package/src/molecules/action-footer/ActionFooter.tsx +2 -1
  7. package/src/molecules/hero-section/HeroSection.tsx +5 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@umituz/react-native-design-system",
3
- "version": "2.6.106",
3
+ "version": "2.6.107",
4
4
  "description": "Universal design system for React Native apps - Consolidated package with atoms, molecules, organisms, theme, typography, responsive and safe area utilities",
5
5
  "main": "./src/index.ts",
6
6
  "types": "./src/index.ts",
package/src/atoms/EmptyState.tsx CHANGED
@@ -57,7 +57,7 @@ export const EmptyState: React.FC<EmptyStateProps> = ({
57
57
  <AtomicText
58
58
  type="headlineSmall"
59
59
  color="primary"
60
- style={[styles.title, { textAlign: 'center' }]}
60
+ style={[styles.title, { textAlign: 'left' }]}
61
61
  >
62
62
  {title}
63
63
  </AtomicText>
@@ -66,7 +66,7 @@ export const EmptyState: React.FC<EmptyStateProps> = ({
66
66
  <AtomicText
67
67
  type="bodyMedium"
68
68
  color="secondary"
69
- style={[styles.description, { textAlign: 'center' }]}
69
+ style={[styles.description, { textAlign: 'left' }]}
70
70
  >
71
71
  {displayDescription}
72
72
  </AtomicText>
@@ -93,16 +93,16 @@ export const EmptyState: React.FC<EmptyStateProps> = ({
93
93
  const styles = StyleSheet.create({
94
94
  container: {
95
95
  flex: 1,
96
- alignItems: 'center',
97
- justifyContent: 'center',
96
+ alignItems: 'flex-start',
97
+ justifyContent: 'flex-start',
98
98
  padding: STATIC_TOKENS.spacing.xl,
99
99
  },
100
100
  iconContainer: {
101
101
  width: 120,
102
102
  height: 120,
103
103
  borderRadius: 60,
104
- alignItems: 'center',
105
- justifyContent: 'center',
104
+ alignItems: 'flex-start',
105
+ justifyContent: 'flex-start',
106
106
  marginBottom: STATIC_TOKENS.spacing.lg,
107
107
  },
108
108
  title: {
@@ -110,7 +110,6 @@ const styles = StyleSheet.create({
110
110
  },
111
111
  description: {
112
112
  marginBottom: STATIC_TOKENS.spacing.lg,
113
- maxWidth: 280,
114
113
  },
115
114
  actionButton: {
116
115
  paddingHorizontal: STATIC_TOKENS.spacing.lg,
package/src/atoms/button/styles/buttonStyles.ts CHANGED
@@ -7,13 +7,13 @@ import { StyleSheet } from 'react-native';
7
7
  export const buttonStyles = StyleSheet.create({
8
8
  button: {
9
9
  alignItems: 'center',
10
- justifyContent: 'center',
10
+ justifyContent: 'flex-start',
11
11
  flexDirection: 'row',
12
12
  },
13
13
  content: {
14
14
  flexDirection: 'row',
15
15
  alignItems: 'center',
16
- justifyContent: 'center',
16
+ justifyContent: 'flex-start',
17
17
  },
18
18
  rowReverse: {
19
19
  flexDirection: 'row-reverse',
package/src/atoms/card/AtomicCard.tsx CHANGED
@@ -19,7 +19,7 @@ import { getCardVariantStyles, cardStyles } from './styles/cardStyles';
19
19
  import { getCardPadding } from './configs/cardPaddingConfig';
20
20
  import type { AtomicCardProps } from './types';
21
21
 
22
- export const AtomicCard: React.FC<AtomicCardProps> = ({
22
+ const AtomicCardComponent: React.FC<AtomicCardProps> = ({
23
23
  children,
24
24
  variant = 'elevated',
25
25
  padding = 'md',
@@ -181,3 +181,5 @@ export const AtomicCard: React.FC<AtomicCardProps> = ({
181
181
  </View>
182
182
  );
183
183
  };
184
+
185
+ export const AtomicCard = React.memo(AtomicCardComponent);
package/src/layouts/ScreenLayout/styles/screenLayoutStyles.ts CHANGED
@@ -25,7 +25,7 @@ export const getScreenLayoutStyles = (
25
25
  responsiveWrapper: {
26
26
  flex: 1,
27
27
  width: '100%',
28
- ...(maxWidth ? { maxWidth, alignSelf: 'center' as const } : {}),
28
+ ...(maxWidth ? { maxWidth, alignSelf: 'flex-start' as const } : {}),
29
29
  },
30
30
  content: {
31
31
  flex: 1,
package/src/molecules/action-footer/ActionFooter.tsx CHANGED
@@ -44,9 +44,10 @@ export const ActionFooter: React.FC<ActionFooterProps> = ({
44
44
  flex: 1,
45
45
  flexDirection: 'row',
46
46
  alignItems: 'center',
47
- justifyContent: 'center',
47
+ justifyContent: 'flex-start',
48
48
  backgroundColor: tokens.colors.primary,
49
49
  gap: tokens.spacing.sm,
50
+ paddingHorizontal: tokens.spacing.lg,
50
51
  },
51
52
  actionText: {
52
53
  color: tokens.colors.onPrimary,
package/src/molecules/hero-section/HeroSection.tsx CHANGED
@@ -21,8 +21,8 @@ export const HeroSection: React.FC<HeroSectionProps> = ({
21
21
  height: height || 400,
22
22
  position: 'relative',
23
23
  backgroundColor: tokens.colors.surface,
24
- justifyContent: 'center',
25
- alignItems: 'center',
24
+ justifyContent: 'flex-start',
25
+ alignItems: 'flex-start',
26
26
  overflow: 'hidden',
27
27
  },
28
28
  background: {
@@ -39,15 +39,15 @@ export const HeroSection: React.FC<HeroSectionProps> = ({
39
39
  height: 120,
40
40
  borderRadius: 60,
41
41
  backgroundColor: tokens.colors.surfaceVariant,
42
- justifyContent: 'center',
43
- alignItems: 'center',
42
+ justifyContent: 'flex-start',
43
+ alignItems: 'flex-start',
44
44
  borderWidth: 2,
45
45
  borderColor: tokens.colors.outlineVariant,
46
46
  zIndex: 10,
47
47
  },
48
48
  emoji: {
49
49
  fontSize: 64,
50
- textAlign: 'center',
50
+ textAlign: 'left',
51
51
  includeFontPadding: false,
52
52
  },
53
53
  fadeOverlay: {