@umituz/react-native-design-system 2.3.10 → 2.3.11
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 +1 -1
- package/src/index.ts +45 -9
- package/src/{organisms → layouts/AppHeader}/AppHeader.tsx +2 -2
- package/src/layouts/AppHeader/index.ts +1 -0
- package/src/{molecules → layouts/ScreenHeader}/ScreenHeader.tsx +2 -2
- package/src/layouts/ScreenHeader/index.ts +1 -0
- package/src/{organisms → layouts/ScreenLayout}/ScreenLayout.tsx +4 -4
- package/src/layouts/ScreenLayout/index.ts +1 -0
- package/src/layouts/index.ts +6 -0
- package/src/molecules/bottom-sheet/components/filter/FilterBottomSheet.tsx +1 -1
- package/src/molecules/bottom-sheet/components/filter/FilterSheet.tsx +2 -2
- package/src/molecules/index.ts +0 -3
- package/src/organisms/index.ts +1 -13
- /package/src/{molecules → layouts}/Container/Container.tsx +0 -0
- /package/src/{molecules → layouts}/Container/index.ts +0 -0
- /package/src/{organisms → layouts}/FormLayout/FormLayout.tsx +0 -0
- /package/src/{organisms → layouts}/FormLayout/index.ts +0 -0
- /package/src/{molecules → layouts}/Grid/Grid.tsx +0 -0
- /package/src/{molecules → layouts}/Grid/index.ts +0 -0
- /package/src/{organisms → layouts/ScreenLayout}/ScreenLayout.example.tsx +0 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umituz/react-native-design-system",
|
|
3
|
-
"version": "2.3.
|
|
3
|
+
"version": "2.3.11",
|
|
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/index.ts
CHANGED
|
@@ -226,6 +226,25 @@ export {
|
|
|
226
226
|
type BadgeSize,
|
|
227
227
|
} from './atoms';
|
|
228
228
|
|
|
229
|
+
// =============================================================================
|
|
230
|
+
// LAYOUTS EXPORTS
|
|
231
|
+
// =============================================================================
|
|
232
|
+
|
|
233
|
+
export {
|
|
234
|
+
ScreenLayout,
|
|
235
|
+
AppHeader,
|
|
236
|
+
ScreenHeader,
|
|
237
|
+
Grid,
|
|
238
|
+
Container,
|
|
239
|
+
FormLayout,
|
|
240
|
+
type ScreenLayoutProps,
|
|
241
|
+
type AppHeaderProps,
|
|
242
|
+
type ScreenHeaderProps,
|
|
243
|
+
type GridProps,
|
|
244
|
+
type ContainerProps,
|
|
245
|
+
type FormLayoutProps,
|
|
246
|
+
} from './layouts';
|
|
247
|
+
|
|
229
248
|
// =============================================================================
|
|
230
249
|
// MOLECULES EXPORTS
|
|
231
250
|
// =============================================================================
|
|
@@ -235,14 +254,36 @@ export {
|
|
|
235
254
|
ListItem,
|
|
236
255
|
SearchBar,
|
|
237
256
|
IconContainer,
|
|
238
|
-
ScreenHeader,
|
|
239
257
|
BaseModal,
|
|
240
258
|
ConfirmationModal,
|
|
241
259
|
useConfirmationModal,
|
|
242
260
|
StepProgress,
|
|
243
|
-
Grid,
|
|
244
261
|
List,
|
|
245
|
-
|
|
262
|
+
Avatar,
|
|
263
|
+
AvatarGroup,
|
|
264
|
+
AvatarUtils,
|
|
265
|
+
type AvatarProps,
|
|
266
|
+
type AvatarGroupProps,
|
|
267
|
+
type AvatarGroupItem,
|
|
268
|
+
type AvatarSize,
|
|
269
|
+
type AvatarShape,
|
|
270
|
+
type AvatarConfig,
|
|
271
|
+
type AvatarType,
|
|
272
|
+
// Bottom Sheet
|
|
273
|
+
BottomSheet,
|
|
274
|
+
BottomSheetModal,
|
|
275
|
+
SafeBottomSheetModalProvider,
|
|
276
|
+
FilterBottomSheet,
|
|
277
|
+
FilterSheet,
|
|
278
|
+
useBottomSheet,
|
|
279
|
+
useBottomSheetModal,
|
|
280
|
+
useListFilters,
|
|
281
|
+
type BottomSheetProps,
|
|
282
|
+
type BottomSheetModalProps,
|
|
283
|
+
type BottomSheetRef,
|
|
284
|
+
type BottomSheetModalRef,
|
|
285
|
+
type FilterOption,
|
|
286
|
+
type FilterCategory,
|
|
246
287
|
// Alerts
|
|
247
288
|
AlertBanner,
|
|
248
289
|
AlertToast,
|
|
@@ -256,9 +297,7 @@ export {
|
|
|
256
297
|
AlertMode,
|
|
257
298
|
AlertPosition,
|
|
258
299
|
type BaseModalProps,
|
|
259
|
-
type GridProps,
|
|
260
300
|
type ListProps,
|
|
261
|
-
type ContainerProps,
|
|
262
301
|
type Alert,
|
|
263
302
|
type AlertAction,
|
|
264
303
|
type AlertOptions,
|
|
@@ -269,11 +308,8 @@ export {
|
|
|
269
308
|
// =============================================================================
|
|
270
309
|
|
|
271
310
|
export {
|
|
272
|
-
ScreenLayout,
|
|
273
|
-
AppHeader,
|
|
274
311
|
FormContainer,
|
|
275
|
-
|
|
276
|
-
type FormLayoutProps,
|
|
312
|
+
type FormContainerProps,
|
|
277
313
|
} from './organisms';
|
|
278
314
|
|
|
279
315
|
// =============================================================================
|
|
@@ -11,8 +11,8 @@
|
|
|
11
11
|
import React from 'react';
|
|
12
12
|
import { View, type ViewStyle } from 'react-native';
|
|
13
13
|
import { SafeAreaView } from 'react-native-safe-area-context';
|
|
14
|
-
import { useAppDesignTokens } from '
|
|
15
|
-
import { AtomicText, AtomicButton, type IconName } from '
|
|
14
|
+
import { useAppDesignTokens } from '../../theme';
|
|
15
|
+
import { AtomicText, AtomicButton, type IconName } from '../../atoms';
|
|
16
16
|
|
|
17
17
|
// =============================================================================
|
|
18
18
|
// TYPE DEFINITIONS
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './AppHeader';
|
|
@@ -14,8 +14,8 @@
|
|
|
14
14
|
|
|
15
15
|
import React from 'react';
|
|
16
16
|
import { View, TouchableOpacity, ViewStyle } from 'react-native';
|
|
17
|
-
import { AtomicIcon, AtomicText } from '
|
|
18
|
-
import { useAppDesignTokens } from '
|
|
17
|
+
import { AtomicIcon, AtomicText } from '../../atoms';
|
|
18
|
+
import { useAppDesignTokens } from '../../theme';
|
|
19
19
|
|
|
20
20
|
export interface ScreenHeaderProps {
|
|
21
21
|
/** Screen title (centered) */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './ScreenHeader';
|
|
@@ -27,10 +27,10 @@ import React, { useMemo } from 'react';
|
|
|
27
27
|
import { View, ScrollView, StyleSheet, type ViewStyle, RefreshControlProps } from 'react-native';
|
|
28
28
|
import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
29
29
|
import type { Edge } from 'react-native-safe-area-context';
|
|
30
|
-
import { useAppDesignTokens } from '
|
|
31
|
-
import { useResponsive } from '
|
|
32
|
-
import { getResponsiveMaxWidth } from '
|
|
33
|
-
import { getResponsiveHorizontalPadding } from '
|
|
30
|
+
import { useAppDesignTokens } from '../../theme';
|
|
31
|
+
import { useResponsive } from '../../responsive/useResponsive';
|
|
32
|
+
import { getResponsiveMaxWidth } from '../../responsive/responsiveSizing';
|
|
33
|
+
import { getResponsiveHorizontalPadding } from '../../responsive/responsiveLayout';
|
|
34
34
|
|
|
35
35
|
/**
|
|
36
36
|
* NOTE: This component now works in conjunction with the SafeAreaProvider
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './ScreenLayout';
|
|
@@ -8,7 +8,7 @@ import React, { forwardRef, useCallback } from 'react';
|
|
|
8
8
|
import { View, StyleSheet, TouchableOpacity, ScrollView } from 'react-native';
|
|
9
9
|
import { BottomSheetModal } from '../BottomSheetModal';
|
|
10
10
|
import type { BottomSheetModalRef } from '../../types/BottomSheet';
|
|
11
|
-
import { AtomicText, AtomicIcon, AtomicButton } from
|
|
11
|
+
import { AtomicText, AtomicIcon, AtomicButton } from "../../../../atoms";
|
|
12
12
|
import { useAppDesignTokens } from '../../../../theme';
|
|
13
13
|
import type { FilterOption, FilterCategory } from '../../types/Filter';
|
|
14
14
|
import { FilterUtils } from '../../types/Filter';
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React, { useCallback } from "react";
|
|
2
2
|
import { View, StyleSheet, ScrollView, Modal, Pressable } from "react-native";
|
|
3
3
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
4
|
-
import { AtomicButton } from "
|
|
4
|
+
import { AtomicText, AtomicIcon, AtomicButton } from "../../../../atoms";
|
|
5
5
|
import { useAppDesignTokens } from "../../../../theme";
|
|
6
|
-
import type { FilterOption } from "../../types/Filter";
|
|
6
|
+
import type { FilterOption, FilterCategory } from "../../types/Filter";
|
|
7
7
|
import { FilterUtils } from "../../types/Filter";
|
|
8
8
|
import { FilterSheetHeader } from "./FilterSheetComponents/FilterSheetHeader";
|
|
9
9
|
import { FilterSheetOption } from "./FilterSheetComponents/FilterSheetOption";
|
package/src/molecules/index.ts
CHANGED
|
@@ -10,7 +10,6 @@ export { FormField, type FormFieldProps } from './FormField';
|
|
|
10
10
|
export { ListItem, type ListItemProps } from './ListItem';
|
|
11
11
|
export { SearchBar, type SearchBarProps } from './SearchBar';
|
|
12
12
|
export { IconContainer } from './IconContainer';
|
|
13
|
-
export { ScreenHeader, type ScreenHeaderProps } from './ScreenHeader';
|
|
14
13
|
export { BaseModal, type BaseModalProps } from './BaseModal';
|
|
15
14
|
export { ConfirmationModal } from './ConfirmationModalMain';
|
|
16
15
|
export { useConfirmationModal } from './confirmation-modal/useConfirmationModal';
|
|
@@ -26,9 +25,7 @@ export * from './Divider';
|
|
|
26
25
|
export * from "./StepProgress";
|
|
27
26
|
|
|
28
27
|
// Responsive Components
|
|
29
|
-
export { Grid, type GridProps } from './Grid';
|
|
30
28
|
export { List, type ListProps } from './List';
|
|
31
|
-
export { Container, type ContainerProps } from './Container';
|
|
32
29
|
|
|
33
30
|
// Alerts
|
|
34
31
|
export * from './alerts';
|
package/src/organisms/index.ts
CHANGED
|
@@ -11,25 +11,13 @@
|
|
|
11
11
|
*/
|
|
12
12
|
|
|
13
13
|
// Component exports
|
|
14
|
-
export { AppHeader } from './AppHeader';
|
|
15
|
-
export { ScreenLayout } from './ScreenLayout';
|
|
16
14
|
export { FormContainer } from './FormContainer';
|
|
17
|
-
export { FormLayout } from './FormLayout';
|
|
18
15
|
|
|
19
16
|
// Type exports
|
|
20
|
-
export type { AppHeaderProps } from './AppHeader';
|
|
21
|
-
export type { ScreenLayoutProps } from './ScreenLayout';
|
|
22
17
|
export type { FormContainerProps } from './FormContainer';
|
|
23
|
-
export type { FormLayoutProps } from './FormLayout';
|
|
24
18
|
|
|
25
19
|
// Union type for all organism props (used for type narrowing)
|
|
26
|
-
import type { AppHeaderProps } from './AppHeader';
|
|
27
|
-
import type { ScreenLayoutProps } from './ScreenLayout';
|
|
28
20
|
import type { FormContainerProps } from './FormContainer';
|
|
29
|
-
import type { FormLayoutProps } from './FormLayout';
|
|
30
21
|
|
|
31
22
|
export type OrganismComponentProps =
|
|
32
|
-
| { type: '
|
|
33
|
-
| { type: 'ScreenLayout'; props: ScreenLayoutProps }
|
|
34
|
-
| { type: 'FormContainer'; props: FormContainerProps }
|
|
35
|
-
| { type: 'FormLayout'; props: FormLayoutProps };
|
|
23
|
+
| { type: 'FormContainer'; props: FormContainerProps };
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|