react-native-molecules 0.5.0-beta.1 → 0.5.0-beta.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 (119) hide show
  1. package/README.md +87 -0
  2. package/components/Accordion/index.tsx +1 -6
  3. package/components/Accordion/utils.ts +17 -14
  4. package/components/ActivityIndicator/ActivityIndicator.tsx +6 -5
  5. package/components/ActivityIndicator/index.tsx +1 -5
  6. package/components/Appbar/index.tsx +1 -4
  7. package/components/Appbar/utils.ts +33 -21
  8. package/components/Avatar/index.tsx +1 -5
  9. package/components/Avatar/utils.ts +2 -6
  10. package/components/Backdrop/Backdrop.tsx +2 -2
  11. package/components/Backdrop/index.tsx +1 -5
  12. package/components/Backdrop/utils.ts +5 -6
  13. package/components/Badge/index.tsx +1 -5
  14. package/components/Badge/utils.ts +2 -6
  15. package/components/Button/Button.tsx +3 -1
  16. package/components/Button/index.tsx +1 -5
  17. package/components/Button/utils.ts +5 -6
  18. package/components/Card/Card.tsx +8 -4
  19. package/components/Card/CardContent.tsx +5 -4
  20. package/components/Card/CardHeader.tsx +5 -3
  21. package/components/Card/CardMedia.tsx +5 -3
  22. package/components/Card/CardTypography.tsx +5 -3
  23. package/components/Card/index.tsx +1 -5
  24. package/components/Card/utils.ts +5 -6
  25. package/components/Checkbox/Checkbox.tsx +1 -0
  26. package/components/Checkbox/CheckboxBase.ios.tsx +1 -0
  27. package/components/Checkbox/CheckboxBase.tsx +1 -0
  28. package/components/Checkbox/index.tsx +1 -5
  29. package/components/Checkbox/utils.ts +6 -6
  30. package/components/Chip/index.tsx +1 -5
  31. package/components/Chip/utils.ts +2 -6
  32. package/components/DatePickerDocked/index.tsx +1 -5
  33. package/components/DatePickerDocked/utils.ts +21 -19
  34. package/components/DatePickerInline/index.tsx +1 -5
  35. package/components/DatePickerInline/utils.ts +41 -28
  36. package/components/DatePickerInput/index.tsx +1 -5
  37. package/components/DatePickerInput/utils.ts +5 -6
  38. package/components/DatePickerModal/index.tsx +1 -5
  39. package/components/DatePickerModal/utils.ts +17 -16
  40. package/components/DateTimePicker/index.tsx +1 -5
  41. package/components/DateTimePicker/utils.ts +5 -6
  42. package/components/Dialog/index.tsx +1 -5
  43. package/components/Dialog/utils.ts +22 -16
  44. package/components/Drawer/Collapsible/utils.ts +13 -13
  45. package/components/Drawer/Drawer.tsx +2 -3
  46. package/components/Drawer/DrawerContent.tsx +5 -3
  47. package/components/Drawer/DrawerFooter.tsx +5 -4
  48. package/components/Drawer/DrawerHeader.tsx +5 -4
  49. package/components/Drawer/DrawerItem.tsx +5 -3
  50. package/components/Drawer/DrawerItemGroup.tsx +5 -4
  51. package/components/Drawer/index.tsx +1 -5
  52. package/components/Drawer/utils.ts +7 -7
  53. package/components/ElementGroup/index.tsx +1 -5
  54. package/components/ElementGroup/utils.ts +5 -6
  55. package/components/FAB/index.tsx +1 -5
  56. package/components/FAB/utils.ts +2 -6
  57. package/components/FilePicker/index.tsx +1 -5
  58. package/components/FilePicker/utils.ts +5 -6
  59. package/components/HelperText/index.tsx +1 -5
  60. package/components/HelperText/utils.ts +5 -7
  61. package/components/HorizontalDivider/HorizontalDivider.tsx +5 -3
  62. package/components/HorizontalDivider/index.tsx +1 -5
  63. package/components/Icon/CrossFadeIcon.tsx +3 -5
  64. package/components/Icon/Icon.tsx +2 -4
  65. package/components/Icon/index.tsx +1 -5
  66. package/components/IconButton/IconButton.tsx +3 -1
  67. package/components/IconButton/index.tsx +1 -5
  68. package/components/IconButton/utils.ts +11 -16
  69. package/components/If/index.tsx +1 -5
  70. package/components/InputAddon/index.tsx +1 -5
  71. package/components/InputAddon/utils.ts +5 -6
  72. package/components/Link/index.tsx +1 -5
  73. package/components/Link/utils.ts +2 -6
  74. package/components/ListItem/index.tsx +1 -5
  75. package/components/ListItem/utils.ts +13 -11
  76. package/components/Menu/index.tsx +1 -5
  77. package/components/Menu/utils.ts +6 -8
  78. package/components/Modal/index.tsx +1 -5
  79. package/components/Modal/utils.ts +2 -6
  80. package/components/NavigationRail/NavigationRailHeader.tsx +1 -1
  81. package/components/NavigationRail/index.tsx +1 -5
  82. package/components/NavigationRail/utils.ts +21 -17
  83. package/components/NavigationStack/index.tsx +1 -5
  84. package/components/NavigationStack/utils.tsx +7 -1
  85. package/components/Portal/index.tsx +1 -5
  86. package/components/RadioButton/index.ts +1 -5
  87. package/components/RadioButton/utils.ts +9 -8
  88. package/components/Rating/index.tsx +1 -5
  89. package/components/Rating/utils.ts +6 -8
  90. package/components/StateLayer/index.tsx +1 -5
  91. package/components/StateLayer/utils.ts +5 -6
  92. package/components/Surface/index.tsx +1 -5
  93. package/components/Surface/utils.ts +5 -6
  94. package/components/Switch/index.tsx +1 -5
  95. package/components/Switch/utils.ts +2 -6
  96. package/components/Tabs/index.tsx +1 -5
  97. package/components/Tabs/utils.ts +10 -10
  98. package/components/Text/Text.tsx +2 -8
  99. package/components/TextInput/TextInput.tsx +1 -0
  100. package/components/TextInput/index.tsx +1 -5
  101. package/components/TextInput/utils.ts +8 -15
  102. package/components/TextInputWithMask/index.tsx +1 -5
  103. package/components/TimePicker/AmPmSwitcher.tsx +1 -1
  104. package/components/TimePicker/index.tsx +1 -5
  105. package/components/TimePicker/utils.ts +29 -21
  106. package/components/TimePickerField/index.tsx +1 -5
  107. package/components/TimePickerField/utils.ts +5 -6
  108. package/components/TimePickerModal/index.tsx +1 -5
  109. package/components/TimePickerModal/utils.ts +5 -6
  110. package/components/Tooltip/index.tsx +1 -5
  111. package/components/Tooltip/utils.ts +5 -6
  112. package/components/TouchableRipple/index.tsx +1 -5
  113. package/components/TouchableRipple/utils.ts +5 -6
  114. package/components/VerticalDivider/VerticalDivider.tsx +9 -8
  115. package/components/VerticalDivider/index.tsx +1 -5
  116. package/core/componentsRegistry.ts +31 -19
  117. package/package.json +1 -3
  118. package/utils/lodash.ts +0 -1
  119. package/utils/repository.ts +2 -52
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const elementGroupStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {
@@ -18,8 +18,7 @@ const elementGroupStylesDefault = StyleSheet.create(theme => ({
18
18
  },
19
19
  }));
20
20
 
21
- registerComponentsStyles({
22
- ElementGroup: elementGroupStylesDefault,
23
- });
24
-
25
- export const elementGroupStyles = getRegisteredMoleculesComponentStyles('ElementGroup');
21
+ export const elementGroupStyles = getRegisteredComponentStylesWithFallback(
22
+ 'ElementGroup',
23
+ elementGroupStylesDefault,
24
+ );
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import FABDefault from './FAB';
3
3
 
4
- registerMoleculesComponents({
5
- FAB: FABDefault,
6
- });
7
-
8
4
  export const FAB = getRegisteredComponentWithFallback('FAB', FABDefault);
9
5
 
10
6
  export type { Props as FABProps } from './FAB';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  export const iconSizeMap = {
6
6
  xs: 18,
@@ -212,10 +212,6 @@ const fabStylesDefault = StyleSheet.create(theme => ({
212
212
  },
213
213
  }));
214
214
 
215
- registerComponentsStyles({
216
- FAB: fabStylesDefault,
217
- });
218
-
219
- export const fabStyles = getRegisteredMoleculesComponentStyles('FAB');
215
+ export const fabStyles = getRegisteredComponentStylesWithFallback('FAB', fabStylesDefault);
220
216
 
221
217
  export type States = 'hovered' | 'disabled';
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import FilePickerDefault from './FilePicker';
3
3
 
4
- registerMoleculesComponents({
5
- FilePicker: FilePickerDefault,
6
- });
7
-
8
4
  export const FilePicker = getRegisteredComponentWithFallback('FilePicker', FilePickerDefault);
9
5
 
10
6
  export type { Props as FilePickerProps } from './FilePicker';
@@ -1,13 +1,12 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const filePickerStylesDefault = StyleSheet.create({
6
6
  root: {},
7
7
  });
8
8
 
9
- registerComponentsStyles({
10
- FilePicker: filePickerStylesDefault,
11
- });
12
-
13
- export const defaultStyles = getRegisteredMoleculesComponentStyles('FilePicker');
9
+ export const defaultStyles = getRegisteredComponentStylesWithFallback(
10
+ 'FilePicker',
11
+ filePickerStylesDefault,
12
+ );
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import HelperTextDefault from './HelperText';
3
3
 
4
- registerMoleculesComponents({
5
- HelperText: HelperTextDefault,
6
- });
7
-
8
4
  export const HelperText = getRegisteredComponentWithFallback('HelperText', HelperTextDefault);
9
5
 
10
6
  export { type Props as HelperTextProps } from './HelperText';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  export const helperTextStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {
@@ -21,9 +21,7 @@ export const helperTextStylesDefault = StyleSheet.create(theme => ({
21
21
  },
22
22
  }));
23
23
 
24
- registerComponentsStyles({
25
- HelperText: helperTextStylesDefault,
26
- });
27
-
28
- export const styles =
29
- getRegisteredMoleculesComponentStyles('HelperText') || helperTextStylesDefault;
24
+ export const styles = getRegisteredComponentStylesWithFallback(
25
+ 'HelperText',
26
+ helperTextStylesDefault,
27
+ );
@@ -2,7 +2,7 @@ import { memo } from 'react';
2
2
  import { type StyleProp, View, type ViewProps, type ViewStyle } from 'react-native';
3
3
  import { StyleSheet } from 'react-native-unistyles';
4
4
 
5
- import { getRegisteredMoleculesComponentStyles, registerComponentStyles } from '../../core';
5
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
6
6
 
7
7
  export type Props = Omit<ViewProps, 'children'> & {
8
8
  /**
@@ -95,7 +95,9 @@ export const horizontalDividerStylesDefault = StyleSheet.create(theme => ({
95
95
  },
96
96
  }));
97
97
 
98
- registerComponentStyles('HorizontalDivider', horizontalDividerStylesDefault);
99
- export const horizontalDividerStyles = getRegisteredMoleculesComponentStyles('HorizontalDivider');
98
+ export const horizontalDividerStyles = getRegisteredComponentStylesWithFallback(
99
+ 'HorizontalDivider',
100
+ horizontalDividerStylesDefault,
101
+ );
100
102
 
101
103
  export default memo(HorizontalDivider);
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import HorizontalDividerDefault from './HorizontalDivider';
3
3
 
4
- registerMoleculesComponents({
5
- HorizontalDivider: HorizontalDividerDefault,
6
- });
7
-
8
4
  export const HorizontalDivider = getRegisteredComponentWithFallback(
9
5
  'HorizontalDivider',
10
6
  HorizontalDividerDefault,
@@ -1,14 +1,12 @@
1
1
  import { useEffect, useMemo, useRef, useState } from 'react';
2
2
  import { Animated, StyleSheet, View } from 'react-native';
3
3
 
4
- import Icon, { styles as iconStyles } from './Icon';
4
+ import Icon from './Icon';
5
5
  import type { IconProps } from './types';
6
6
 
7
7
  type Props = IconProps;
8
8
 
9
9
  const CrossFadeIcon = ({ color, size, name, style, ...rest }: Omit<Props, 'ref'>) => {
10
- // const { animationScale: scale } = useComponentStyles('Icon', style);
11
- const { animationScale: scale } = iconStyles.root;
12
10
  const [currentIcon, setCurrentIcon] = useState<string>(name);
13
11
  const [previousIcon, setPreviousIcon] = useState<string | null>(null);
14
12
  const { current: fade } = useRef<Animated.Value>(new Animated.Value(1));
@@ -25,12 +23,12 @@ const CrossFadeIcon = ({ color, size, name, style, ...rest }: Omit<Props, 'ref'>
25
23
  fade.setValue(1);
26
24
 
27
25
  Animated.timing(fade, {
28
- duration: scale * 200,
26
+ duration: 200,
29
27
  toValue: 0,
30
28
  useNativeDriver: true,
31
29
  }).start();
32
30
  }
33
- }, [currentIcon, previousIcon, fade, scale]);
31
+ }, [currentIcon, previousIcon, fade]);
34
32
 
35
33
  const opacityPrev = fade;
36
34
  const opacityNext = previousIcon
@@ -1,7 +1,7 @@
1
1
  import { forwardRef, memo, useMemo } from 'react';
2
2
  import { StyleSheet } from 'react-native-unistyles';
3
3
 
4
- import { getRegisteredMoleculesComponentStyles, registerComponentStyles } from '../../core';
4
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
5
5
  import { tokenStylesParser } from '../../utils/tokenStylesParser';
6
6
  import iconFactory from './iconFactory';
7
7
  import type { IconProps } from './types';
@@ -25,8 +25,6 @@ export const iconStylesDefault = StyleSheet.create(theme => ({
25
25
  },
26
26
  }));
27
27
 
28
- registerComponentStyles('Icon', iconStylesDefault);
29
-
30
- export const styles = getRegisteredMoleculesComponentStyles('Icon');
28
+ export const styles = getRegisteredComponentStylesWithFallback('Icon', iconStylesDefault);
31
29
 
32
30
  export default memo(forwardRef(Icon));
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import IconDefault from './Icon';
3
3
 
4
- registerMoleculesComponents({
5
- Icon: IconDefault,
6
- });
7
-
8
4
  export const Icon = getRegisteredComponentWithFallback('Icon', IconDefault);
9
5
 
10
6
  export { registerCustomIconType } from './iconFactory';
@@ -113,7 +113,9 @@ const IconButton = (
113
113
  });
114
114
 
115
115
  defaultStyles.useVariants({
116
- variant,
116
+ // @ts-ignore // TODO - fix this
117
+ variant: variant as any,
118
+ // @ts-ignore // TODO - fix this
117
119
  state,
118
120
  size: typeof size === 'string' && size ? size : undefined,
119
121
  });
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import IconButtonDefault from './IconButton';
3
3
 
4
- registerMoleculesComponents({
5
- IconButton: IconButtonDefault,
6
- });
7
-
8
4
  export const IconButton = getRegisteredComponentWithFallback('IconButton', IconButtonDefault);
9
5
 
10
6
  export type { Props as IconButtonProps } from './IconButton';
@@ -1,11 +1,9 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
3
  import {
4
- getRegisteredMoleculesComponentStyles,
5
- registerComponentsStyles,
6
- registerComponentUtils,
7
- } from '../../core';
8
- import { getRegisteredComponentUtils } from './../../core/componentsRegistry';
4
+ getRegisteredComponentStylesWithFallback,
5
+ getRegisteredComponentUtilsWithFallback,
6
+ } from './../../core/componentsRegistry';
9
7
 
10
8
  export type States =
11
9
  | 'selectedAndDisabled'
@@ -311,15 +309,12 @@ const iconButtonStylesDefault = StyleSheet.create(theme => ({
311
309
  },
312
310
  }));
313
311
 
314
- registerComponentsStyles({
315
- IconButton: iconButtonStylesDefault,
316
- });
317
-
318
- registerComponentUtils('IconButton', {
312
+ export const defaultStyles = getRegisteredComponentStylesWithFallback(
313
+ 'IconButton',
314
+ iconButtonStylesDefault,
315
+ );
316
+ export const iconButtonSizeToIconSizeMap = getRegisteredComponentUtilsWithFallback(
317
+ 'IconButton',
319
318
  iconButtonSizeToIconSizeMapDefault,
320
- });
321
-
322
- export const defaultStyles = getRegisteredMoleculesComponentStyles('IconButton');
323
- export const iconButtonSizeToIconSizeMap =
324
- getRegisteredComponentUtils('IconButton')?.iconButtonSizeToIconSizeMapDefault ||
325
- iconButtonSizeToIconSizeMapDefault;
319
+ 'iconButtonSizeToIconSizeMap',
320
+ );
@@ -1,13 +1,9 @@
1
1
  import type { PropsWithChildren } from 'react';
2
2
 
3
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
3
+ import { getRegisteredComponentWithFallback } from '../../core';
4
4
 
5
5
  const IfDefault = (props: PropsWithChildren<{ shouldRender?: boolean }>) => {
6
6
  return <>{!!props.shouldRender && props.children}</>;
7
7
  };
8
8
 
9
- registerMoleculesComponents({
10
- If: IfDefault,
11
- });
12
-
13
9
  export const If = getRegisteredComponentWithFallback('If', IfDefault);
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import InputAddonDefault from './InputAddon';
3
3
 
4
- registerMoleculesComponents({
5
- InputAddon: InputAddonDefault,
6
- });
7
-
8
4
  export const InputAddon = getRegisteredComponentWithFallback('InputAddon', InputAddonDefault);
9
5
 
10
6
  export type { Props as InputAddonProps } from './InputAddon';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const inputAddonStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {
@@ -26,8 +26,7 @@ const inputAddonStylesDefault = StyleSheet.create(theme => ({
26
26
  },
27
27
  }));
28
28
 
29
- registerComponentsStyles({
30
- InputAddon: inputAddonStylesDefault,
31
- });
32
-
33
- export const inputAddonStyles = getRegisteredMoleculesComponentStyles('InputAddon');
29
+ export const inputAddonStyles = getRegisteredComponentStylesWithFallback(
30
+ 'InputAddon',
31
+ inputAddonStylesDefault,
32
+ );
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import LinkDefault from './Link';
3
3
 
4
- registerMoleculesComponents({
5
- Link: LinkDefault,
6
- });
7
-
8
4
  export const Link = getRegisteredComponentWithFallback('Link', LinkDefault);
9
5
 
10
6
  export type { Props as LinkProps } from './Link';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  // type States = 'disabled' | 'hovered';
6
6
 
@@ -32,8 +32,4 @@ const linkStylesDefault = StyleSheet.create(theme => ({
32
32
  },
33
33
  }));
34
34
 
35
- registerComponentsStyles({
36
- Link: linkStylesDefault,
37
- });
38
-
39
- export const linkStyles = getRegisteredMoleculesComponentStyles('Link');
35
+ export const linkStyles = getRegisteredComponentStylesWithFallback('Link', linkStylesDefault);
@@ -1,4 +1,4 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import ListItemComponent from './ListItem';
3
3
  import ListItemDescription from './ListItemDescription';
4
4
  import ListItemTitle from './ListItemTitle';
@@ -8,10 +8,6 @@ const ListItemDefault = Object.assign(ListItemComponent, {
8
8
  Description: ListItemDescription,
9
9
  });
10
10
 
11
- registerMoleculesComponents({
12
- ListItem: ListItemDefault,
13
- });
14
-
15
11
  export const ListItem = getRegisteredComponentWithFallback('ListItem', ListItemDefault);
16
12
 
17
13
  export type { Props as ListItemProps } from './ListItem';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const listItemStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {
@@ -101,13 +101,15 @@ const listItemDescriptionStylesDefault = StyleSheet.create(theme => ({
101
101
  },
102
102
  }));
103
103
 
104
- registerComponentsStyles({
105
- ListItem: listItemStylesDefault,
106
- ListItem_Title: listItemTitleStylesDefault,
107
- ListItem_Description: listItemDescriptionStylesDefault,
108
- });
109
-
110
- export const listItemStyles = getRegisteredMoleculesComponentStyles('ListItem');
111
- export const listItemTitleStyles = getRegisteredMoleculesComponentStyles('ListItem_Title');
112
- export const listItemDescriptionStyles =
113
- getRegisteredMoleculesComponentStyles('ListItem_Description');
104
+ export const listItemStyles = getRegisteredComponentStylesWithFallback(
105
+ 'ListItem',
106
+ listItemStylesDefault,
107
+ );
108
+ export const listItemTitleStyles = getRegisteredComponentStylesWithFallback(
109
+ 'ListItem_Title',
110
+ listItemTitleStylesDefault,
111
+ );
112
+ export const listItemDescriptionStyles = getRegisteredComponentStylesWithFallback(
113
+ 'ListItem_Description',
114
+ listItemDescriptionStylesDefault,
115
+ );
@@ -1,4 +1,4 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import MenuComponent from './Menu';
3
3
  import MenuDivider from './MenuDivider';
4
4
  import MenuItem from './MenuItem';
@@ -8,10 +8,6 @@ export const MenuDefault = Object.assign(MenuComponent, {
8
8
  Divider: MenuDivider,
9
9
  });
10
10
 
11
- registerMoleculesComponents({
12
- Menu: MenuDefault,
13
- });
14
-
15
11
  export const Menu = getRegisteredComponentWithFallback('Menu', MenuDefault);
16
12
 
17
13
  export type { Props as MenuProps } from './Menu';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const menuStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {
@@ -83,10 +83,8 @@ const menuItemStylesDefault = StyleSheet.create(theme => ({
83
83
  },
84
84
  }));
85
85
 
86
- registerComponentsStyles({
87
- Menu: menuStylesDefault,
88
- Menu_Item: menuItemStylesDefault,
89
- });
90
-
91
- export const menuStyles = getRegisteredMoleculesComponentStyles('Menu');
92
- export const menuItemStyles = getRegisteredMoleculesComponentStyles('Menu_Item');
86
+ export const menuStyles = getRegisteredComponentStylesWithFallback('Menu', menuStylesDefault);
87
+ export const menuItemStyles = getRegisteredComponentStylesWithFallback(
88
+ 'Menu_Item',
89
+ menuItemStylesDefault,
90
+ );
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import ModalDefault from './Modal';
3
3
 
4
- registerMoleculesComponents({
5
- Modal: ModalDefault,
6
- });
7
-
8
4
  export const Modal = getRegisteredComponentWithFallback('Modal', ModalDefault);
9
5
 
10
6
  export type { Props as ModalProps } from './Modal';
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const modalStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {},
@@ -38,8 +38,4 @@ const modalStylesDefault = StyleSheet.create(theme => ({
38
38
  },
39
39
  }));
40
40
 
41
- registerComponentsStyles({
42
- Modal: modalStylesDefault,
43
- });
44
-
45
- export const modalStyles = getRegisteredMoleculesComponentStyles('Modal');
41
+ export const modalStyles = getRegisteredComponentStylesWithFallback('Modal', modalStylesDefault);
@@ -7,7 +7,7 @@ export type Props = ViewProps & {};
7
7
 
8
8
  const NavigationRailHeader = memo(({ style, children, ...rest }: Props) => {
9
9
  return (
10
- <View style={[navigationRailHeaderStyles.root, style]} {...rest}>
10
+ <View style={[navigationRailHeaderStyles.header, style]} {...rest}>
11
11
  {children}
12
12
  </View>
13
13
  );
@@ -1,4 +1,4 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import NavigationRailComponent from './NavigationRail';
3
3
  import NavigationRailContent from './NavigationRailContent';
4
4
  import NavigationRailFooter from './NavigationRailFooter';
@@ -12,10 +12,6 @@ export const NavigationRailDefault = Object.assign(NavigationRailComponent, {
12
12
  Footer: NavigationRailFooter,
13
13
  });
14
14
 
15
- registerMoleculesComponents({
16
- NavigationRail: NavigationRailDefault,
17
- });
18
-
19
15
  export const NavigationRail = getRegisteredComponentWithFallback(
20
16
  'NavigationRail',
21
17
  NavigationRailDefault,
@@ -1,6 +1,6 @@
1
1
  import { StyleSheet } from 'react-native-unistyles';
2
2
 
3
- import { getRegisteredMoleculesComponentStyles, registerComponentsStyles } from '../../core';
3
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
4
 
5
5
  const navigationRailStylesDefault = StyleSheet.create(theme => ({
6
6
  root: {
@@ -152,19 +152,23 @@ const navigationRailItemStylesDefault = StyleSheet.create(theme => ({
152
152
  },
153
153
  }));
154
154
 
155
- registerComponentsStyles({
156
- NavigationRail: navigationRailStylesDefault,
157
- NavigationRail_Header: navigationRailHeaderStylesDefault,
158
- NavigationRail_Content: navigationRailContentStylesDefault,
159
- NavigationRail_Footer: navigationRailFooterStylesDefault,
160
- NavigationRail_Item: navigationRailItemStylesDefault,
161
- });
162
-
163
- export const navigationRailStyles = getRegisteredMoleculesComponentStyles('NavigationRail');
164
- export const navigationRailHeaderStyles =
165
- getRegisteredMoleculesComponentStyles('NavigationRail_Header');
166
- export const navigationRailContentStyles =
167
- getRegisteredMoleculesComponentStyles('NavigationRail_Content');
168
- export const navigationRailFooterStyles =
169
- getRegisteredMoleculesComponentStyles('NavigationRail_Footer');
170
- export const navigationRailItemStyles = navigationRailItemStylesDefault;
155
+ export const navigationRailStyles = getRegisteredComponentStylesWithFallback(
156
+ 'NavigationRail',
157
+ navigationRailStylesDefault,
158
+ );
159
+ export const navigationRailHeaderStyles = getRegisteredComponentStylesWithFallback(
160
+ 'NavigationRail_Header',
161
+ navigationRailHeaderStylesDefault,
162
+ );
163
+ export const navigationRailContentStyles = getRegisteredComponentStylesWithFallback(
164
+ 'NavigationRail_Content',
165
+ navigationRailContentStylesDefault,
166
+ );
167
+ export const navigationRailFooterStyles = getRegisteredComponentStylesWithFallback(
168
+ 'NavigationRail_Footer',
169
+ navigationRailFooterStylesDefault,
170
+ );
171
+ export const navigationRailItemStyles = getRegisteredComponentStylesWithFallback(
172
+ 'NavigationRail_Item',
173
+ navigationRailItemStylesDefault,
174
+ );
@@ -1,4 +1,4 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import NavigationStackComponent from './NavigationStack';
3
3
  import NavigationStackItem from './NavigationStackItem';
4
4
 
@@ -6,10 +6,6 @@ export const NavigationStackDefault = Object.assign(NavigationStackComponent, {
6
6
  Item: NavigationStackItem,
7
7
  });
8
8
 
9
- registerMoleculesComponents({
10
- NavigationStack: NavigationStackDefault,
11
- });
12
-
13
9
  export const NavigationStack = getRegisteredComponentWithFallback(
14
10
  'NavigationStack',
15
11
  NavigationStackDefault,
@@ -1,6 +1,7 @@
1
1
  import { useContext } from 'react';
2
2
  import { StyleSheet } from 'react-native-unistyles';
3
3
 
4
+ import { getRegisteredComponentStylesWithFallback } from '../../core';
4
5
  import { NavigationStackContext } from './NavigationStack';
5
6
 
6
7
  export const useNavigation = () => {
@@ -11,6 +12,11 @@ export const useRoute = () => {
11
12
  return useContext(NavigationStackContext).currentRoute;
12
13
  };
13
14
 
14
- export const navigationStackItemStyles = StyleSheet.create({
15
+ export const navigationStackItemStylesDefault = StyleSheet.create({
15
16
  root: {},
16
17
  });
18
+
19
+ export const navigationStackItemStyles = getRegisteredComponentStylesWithFallback(
20
+ 'NavigationStack_Item',
21
+ navigationStackItemStylesDefault,
22
+ );
@@ -1,10 +1,6 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import PortalDefault from './Portal';
3
3
 
4
- registerMoleculesComponents({
5
- Portal: PortalDefault,
6
- });
7
-
8
4
  // @ts-ignore TODO - fix this error
9
5
  export const Portal = getRegisteredComponentWithFallback('Portal', PortalDefault);
10
6
 
@@ -1,4 +1,4 @@
1
- import { getRegisteredComponentWithFallback, registerMoleculesComponents } from '../../core';
1
+ import { getRegisteredComponentWithFallback } from '../../core';
2
2
  import RadioButtonComponent from './RadioButton';
3
3
  import RadioButtonGroup from './RadioButtonGroup';
4
4
  import RadioButtonItem from './RadioButtonItem';
@@ -14,10 +14,6 @@ const RadioButtonDefault = Object.assign(
14
14
  },
15
15
  );
16
16
 
17
- registerMoleculesComponents({
18
- RadioButton: RadioButtonDefault,
19
- });
20
-
21
17
  export const RadioButton = getRegisteredComponentWithFallback('RadioButton', RadioButtonDefault);
22
18
 
23
19
  export type { Props as RadioButtonProps } from './RadioButton';