@holper/react-native-holper-storybook 0.7.0 → 0.7.1

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 (121) hide show
  1. package/README.md +1 -1
  2. package/package.json +5 -1
  3. package/.expo/README.md +0 -8
  4. package/.nvmrc +0 -1
  5. package/.prettierignore +0 -5
  6. package/.storybook/index.jsx +0 -11
  7. package/.storybook/main.js +0 -8
  8. package/.storybook/preview.jsx +0 -51
  9. package/.storybook/storybook.requires.js +0 -43
  10. package/.yarn/releases/yarn-4.5.0.cjs +0 -925
  11. package/.yarnrc.yml +0 -3
  12. package/App.jsx +0 -29
  13. package/app.config.js +0 -77
  14. package/assets/adaptive-icon.png +0 -0
  15. package/assets/favicon.png +0 -0
  16. package/assets/fonts/Poppins-Bold.ttf +0 -0
  17. package/assets/fonts/Poppins-Regular.ttf +0 -0
  18. package/assets/fonts/Poppins-SemiBold.ttf +0 -0
  19. package/assets/icon.png +0 -0
  20. package/assets/splash.png +0 -0
  21. package/babel.config.js +0 -7
  22. package/build.sh +0 -11
  23. package/components/Button/index.tsx +0 -66
  24. package/components/Button/style.ts +0 -111
  25. package/components/Card/index.tsx +0 -33
  26. package/components/Card/style.ts +0 -34
  27. package/components/ConfirmationModal/index.tsx +0 -104
  28. package/components/ConfirmationModal/style.tsx +0 -53
  29. package/components/Container/index.tsx +0 -33
  30. package/components/Container/style.ts +0 -13
  31. package/components/CustomChatView/index.tsx +0 -65
  32. package/components/CustomChatView/style.ts +0 -10
  33. package/components/DeckSwiper/index.tsx +0 -90
  34. package/components/DeckSwiper/style.ts +0 -59
  35. package/components/DonutCountdown/index.tsx +0 -86
  36. package/components/DonutCountdown/style.ts +0 -8
  37. package/components/FloatingContainer/index.tsx +0 -35
  38. package/components/FloatingContainer/style.ts +0 -25
  39. package/components/Footer/index.tsx +0 -35
  40. package/components/Footer/style.ts +0 -40
  41. package/components/Header/index.tsx +0 -21
  42. package/components/Header/style.ts +0 -34
  43. package/components/ImagePicker/index.tsx +0 -18
  44. package/components/ImageResponsive/index.tsx +0 -24
  45. package/components/ImageResponsive/style.ts +0 -9
  46. package/components/ImageViewer/index.tsx +0 -36
  47. package/components/ImageViewer/style.ts +0 -38
  48. package/components/Input/index.tsx +0 -62
  49. package/components/Input/style.ts +0 -91
  50. package/components/InputPin/index.tsx +0 -21
  51. package/components/InputPin/style.ts +0 -22
  52. package/components/MenuItem/index.tsx +0 -25
  53. package/components/MenuItem/style.ts +0 -44
  54. package/components/NavigationTitle/index.tsx +0 -53
  55. package/components/NavigationTitle/style.ts +0 -49
  56. package/components/Notification/index.tsx +0 -44
  57. package/components/Notification/style.ts +0 -50
  58. package/components/PreventDoubleClick/index.tsx +0 -28
  59. package/components/Select/index.tsx +0 -51
  60. package/components/Select/style.ts +0 -64
  61. package/components/SwipeablePanel/index.tsx +0 -208
  62. package/components/SwipeablePanel/style.ts +0 -81
  63. package/components/Switch/index.tsx +0 -30
  64. package/components/TakePicture/confirmPictureModal.tsx +0 -37
  65. package/components/TakePicture/index.tsx +0 -148
  66. package/components/TakePicture/style.ts +0 -95
  67. package/components/Text/index.tsx +0 -33
  68. package/components/Text/style.ts +0 -101
  69. package/components/Textarea/index.tsx +0 -26
  70. package/components/Textarea/style.ts +0 -38
  71. package/components/TimeOutButton/index.tsx +0 -67
  72. package/components/TimeOutButton/style.ts +0 -42
  73. package/components/Toast/index.tsx +0 -34
  74. package/components/Toast/style.ts +0 -12
  75. package/components/UploadDocument/index.tsx +0 -179
  76. package/components/UploadDocument/style.ts +0 -57
  77. package/components/VirtualKeyboard/index.tsx +0 -75
  78. package/components/VirtualKeyboard/style.ts +0 -25
  79. package/components/index.ts +0 -29
  80. package/configs/constants.ts +0 -273
  81. package/configs/types.ts +0 -326
  82. package/eas.json +0 -27
  83. package/eslint.config.mjs +0 -205
  84. package/hooks/index.ts +0 -2
  85. package/hooks/useDebounce.tsx +0 -24
  86. package/hooks/useLoadFonts.tsx +0 -13
  87. package/metro.config.js +0 -11
  88. package/prettier.config.mjs +0 -23
  89. package/stories/Button.stories.tsx +0 -181
  90. package/stories/Card.stories.tsx +0 -22
  91. package/stories/Colors.stories.tsx +0 -57
  92. package/stories/ConfirmationModal.stories.tsx +0 -142
  93. package/stories/Container.stories.tsx +0 -105
  94. package/stories/DeckSwiper.stories.tsx +0 -43
  95. package/stories/DonutCountdown.stories.tsx +0 -134
  96. package/stories/FloatingContainer.stories.tsx +0 -139
  97. package/stories/Footer.stories.tsx +0 -65
  98. package/stories/Header.stories.tsx +0 -37
  99. package/stories/ImagePicker.stories.tsx +0 -14
  100. package/stories/ImageResponsive.stories.tsx +0 -18
  101. package/stories/ImageViewer.stories.tsx +0 -24
  102. package/stories/Input.stories.tsx +0 -119
  103. package/stories/InputPin.stories.tsx +0 -40
  104. package/stories/Menu.stories.tsx +0 -53
  105. package/stories/MenuItem.stories.tsx +0 -30
  106. package/stories/NavigationTitle.stories.tsx +0 -51
  107. package/stories/Notification.stories.tsx +0 -58
  108. package/stories/Select.stories.tsx +0 -270
  109. package/stories/SwipeablePanel.stories.tsx +0 -360
  110. package/stories/Switch.stories.tsx +0 -36
  111. package/stories/TakePicture.stories.tsx +0 -59
  112. package/stories/Text.stories.tsx +0 -61
  113. package/stories/Textarea.stories.tsx +0 -48
  114. package/stories/TimeOutButton.stories.tsx +0 -55
  115. package/stories/Toast.stories.tsx +0 -37
  116. package/stories/UploadDocument.stories.tsx +0 -179
  117. package/stories/VirtualKeyboard.stories.tsx +0 -14
  118. package/tsconfig.json +0 -21
  119. package/utilities/ScrollView.tsx +0 -19
  120. package/utilities/index.ts +0 -2
  121. package/utilities/utils.ts +0 -29
@@ -1,105 +0,0 @@
1
- import { Container, Input, Text } from '../components';
2
-
3
- export default {
4
- title: 'Container',
5
- component: Container,
6
- };
7
-
8
- export const Default = {
9
- render: () => (
10
- <Container fullScreen style={{ padding: 20, alignItems: 'center' }}>
11
- <Text size="large" variant="uppercase" weight="bold">
12
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
13
- </Text>
14
- <Input placeholder="Placeholder" />
15
- <Text>
16
- {'\n'}
17
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
18
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
19
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
20
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
21
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
22
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit metus,
23
- id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
24
- </Text>
25
- </Container>
26
- ),
27
- };
28
-
29
- export const WithScroll = {
30
- render: () => (
31
- <Container enableScroll fullScreen style={{ padding: 20 }} scrollStyle={{ alignItems: 'center' }}>
32
- <Text size="large" variant="uppercase" weight="bold">
33
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
34
- </Text>
35
- <Input placeholder="Placeholder" />
36
- <Text>
37
- {'\n'}
38
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
39
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
40
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
41
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
42
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
43
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit metus,
44
- id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
45
- {'\n'}
46
- {'\n'}
47
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
48
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
49
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
50
- tristique turpis ligula, quis interdum tellus vehicula semper. Morbi at rutrum sem.
51
- {'\n'}
52
- {'\n'}
53
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
54
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
55
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
56
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
57
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
58
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit metus,
59
- id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
60
- {'\n'}
61
- {'\n'}
62
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
63
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
64
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
65
- tristique turpis ligula, quis interdum tellus vehicula semper. sMorbi at rutrum sem.
66
- {'\n'}
67
- {'\n'}
68
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
69
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
70
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
71
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
72
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
73
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit metus,
74
- id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
75
- {'\n'}
76
- {'\n'}
77
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
78
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
79
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
80
- tristique turpis ligula, quis interdum tellus vehicula semper.
81
- {'\n'}
82
- {'\n'}
83
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
84
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
85
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
86
- tristique turpis ligula, quis interdum tellus vehicula semper. sMorbi at rutrum sem.
87
- {'\n'}
88
- {'\n'}
89
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
90
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
91
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
92
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
93
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
94
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit metus,
95
- id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
96
- {'\n'}
97
- {'\n'}
98
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
99
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
100
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
101
- tristique turpis ligula, quis interdum tellus vehicula semper. Morbi at rutrum sem.
102
- </Text>
103
- </Container>
104
- ),
105
- };
@@ -1,43 +0,0 @@
1
- import { DeckSwiper } from '../components';
2
-
3
- import type { DeckSwiperProps } from '../configs/types';
4
-
5
- const data: DeckSwiperProps['data'] = [
6
- {
7
- title: 'Lorem ipsum dolor sit amet',
8
- description:
9
- 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo commodo urna. Vivamus volutpat non lectus non ultrices. Cras metus massa, cursus eget consequat eu, vehicula quis eros. Fusce ex dolor, interdum et neque sed, sollicitudin vehicula justo.',
10
- image: { uri: 'https://picsum.photos/200?random=1' },
11
- },
12
- {
13
- title: 'Quisque orci enim',
14
- description:
15
- 'Cras non molestie justo. Aliquam pharetra libero sit amet nisi dictum aliquam. Nunc iaculis, augue sit amet eleifend ullamcorper, purus felis interdum justo, eget congue velit nisi ac turpis.',
16
- image: { uri: 'https://picsum.photos/200?random=2' },
17
- },
18
- {
19
- title: 'Duis iaculis tortor ornare',
20
- description:
21
- 'Sed dictum, massa ac volutpat commodo, risus elit malesuada lorem, et blandit nibh leo sed magna. Maecenas massa enim, ultrices ut ultricies ut, placerat non orci.',
22
- image: { uri: 'https://picsum.photos/200?random=3' },
23
- },
24
- {
25
- title: 'Ut at laoreet libero',
26
- description:
27
- 'Pellentesque pharetra aliquet nunc at hendrerit. Suspendisse interdum quam varius volutpat consequat. Nunc accumsan vel ligula nec tincidunt.',
28
- image: { uri: 'https://picsum.photos/200?random=4' },
29
- },
30
- ];
31
-
32
- export default {
33
- title: 'DeckSwiper',
34
- component: DeckSwiper,
35
- };
36
-
37
- export const Default = {
38
- render: () => <DeckSwiper data={data} nextText="Next" onChange={() => {}} onFinish={() => {}} />,
39
- };
40
-
41
- export const Inverted = {
42
- render: () => <DeckSwiper inverted data={data} nextText="Next" onChange={() => {}} onFinish={() => {}} />,
43
- };
@@ -1,134 +0,0 @@
1
- import { DonutCountdown } from '../components';
2
- import { Colors } from '../configs/constants';
3
-
4
- export default {
5
- title: 'DonutCountdown',
6
- component: DonutCountdown,
7
- };
8
-
9
- export const Default = {
10
- render: () => (
11
- <DonutCountdown
12
- duration={10}
13
- radius={80}
14
- color={Colors.green}
15
- textColor={Colors.darkgray}
16
- onComplete={() => console.log('Timer finished!')}
17
- />
18
- ),
19
- };
20
-
21
- export const strokeWidth = {
22
- render: () => (
23
- <>
24
- <DonutCountdown
25
- duration={10}
26
- radius={80}
27
- strokeWidth={20}
28
- color={Colors.green}
29
- textColor={Colors.darkgray}
30
- onComplete={() => console.log('Timer finished!')}
31
- />
32
- <DonutCountdown
33
- duration={10}
34
- radius={80}
35
- strokeWidth={10}
36
- color={Colors.green}
37
- textColor={Colors.darkgray}
38
- onComplete={() => console.log('Timer finished!')}
39
- />
40
- <DonutCountdown
41
- duration={10}
42
- radius={80}
43
- strokeWidth={3}
44
- color={Colors.green}
45
- textColor={Colors.darkgray}
46
- onComplete={() => console.log('Timer finished!')}
47
- />
48
- </>
49
- ),
50
- };
51
-
52
- export const Radius = {
53
- render: () => (
54
- <>
55
- <DonutCountdown
56
- duration={10}
57
- radius={120}
58
- color={Colors.green}
59
- textColor={Colors.darkgray}
60
- onComplete={() => console.log('Timer finished!')}
61
- />
62
- <DonutCountdown
63
- duration={10}
64
- radius={60}
65
- color={Colors.green}
66
- textColor={Colors.darkgray}
67
- onComplete={() => console.log('Timer finished!')}
68
- />
69
- <DonutCountdown
70
- duration={10}
71
- radius={30}
72
- color={Colors.green}
73
- textColor={Colors.darkgray}
74
- onComplete={() => console.log('Timer finished!')}
75
- />
76
- </>
77
- ),
78
- };
79
-
80
- export const Duration = {
81
- render: () => (
82
- <>
83
- <DonutCountdown
84
- duration={50}
85
- radius={80}
86
- color={Colors.green}
87
- textColor={Colors.darkgray}
88
- onComplete={() => console.log('Timer finished!')}
89
- />
90
- <DonutCountdown
91
- duration={30}
92
- radius={80}
93
- color={Colors.green}
94
- textColor={Colors.darkgray}
95
- onComplete={() => console.log('Timer finished!')}
96
- />
97
- <DonutCountdown
98
- duration={10}
99
- radius={80}
100
- color={Colors.green}
101
- textColor={Colors.darkgray}
102
- onComplete={() => console.log('Timer finished!')}
103
- />
104
- </>
105
- ),
106
- };
107
-
108
- export const Colorize = {
109
- render: () => (
110
- <>
111
- <DonutCountdown
112
- duration={10}
113
- radius={80}
114
- color={Colors.red}
115
- textColor={Colors.green}
116
- onComplete={() => console.log('Timer finished!')}
117
- />
118
- <DonutCountdown
119
- duration={10}
120
- radius={80}
121
- color={Colors.electricblue}
122
- textColor={Colors.darkgray}
123
- onComplete={() => console.log('Timer finished!')}
124
- />
125
- <DonutCountdown
126
- duration={10}
127
- radius={80}
128
- color={Colors.brightviolet}
129
- textColor={Colors.violet}
130
- onComplete={() => console.log('Timer finished!')}
131
- />
132
- </>
133
- ),
134
- };
@@ -1,139 +0,0 @@
1
- import { View } from 'react-native';
2
-
3
- import { Button, FloatingContainer, Text } from '../components';
4
-
5
- export default {
6
- title: 'Floating Container',
7
- component: FloatingContainer,
8
- };
9
-
10
- export const Default = {
11
- render: () => (
12
- <FloatingContainer
13
- floatingComponent={
14
- <Button>
15
- <Text color="white">Button text</Text>
16
- </Button>
17
- }
18
- >
19
- <View style={{ padding: 20 }}>
20
- <Text size="large" variant="uppercase" weight="bold">
21
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
22
- </Text>
23
- <Text>
24
- {'\n'}
25
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
26
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
27
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
28
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
29
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
30
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit
31
- metus, id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
32
- {'\n'}
33
- {'\n'}
34
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
35
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
36
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
37
- tristique turpis ligula, quis interdum tellus vehicula semper. Morbi at rutrum sem.
38
- {'\n'}
39
- {'\n'}
40
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
41
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
42
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
43
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
44
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
45
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit
46
- metus, id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
47
- {'\n'}
48
- {'\n'}
49
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
50
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
51
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
52
- tristique turpis ligula, quis interdum tellus vehicula semper. sMorbi at rutrum sem.
53
- {'\n'}
54
- {'\n'}
55
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
56
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
57
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
58
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
59
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
60
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit
61
- metus, id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
62
- {'\n'}
63
- {'\n'}
64
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
65
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
66
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
67
- tristique turpis ligula, quis interdum tellus vehicula semper. Morbi at rutrum sem.
68
- </Text>
69
- </View>
70
- </FloatingContainer>
71
- ),
72
- };
73
-
74
- export const RefreshControl = {
75
- render: () => (
76
- <FloatingContainer
77
- useRefreshControl
78
- isRefreshing={false}
79
- onRefresh={() => {}}
80
- floatingComponent={
81
- <Button>
82
- <Text color="white">Button text</Text>
83
- </Button>
84
- }
85
- >
86
- <View style={{ padding: 20 }}>
87
- <Text size="large" variant="uppercase" weight="bold">
88
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
89
- </Text>
90
- <Text>
91
- {'\n'}
92
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
93
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
94
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
95
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
96
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
97
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit
98
- metus, id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
99
- {'\n'}
100
- {'\n'}
101
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
102
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
103
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
104
- tristique turpis ligula, quis interdum tellus vehicula semper. Morbi at rutrum sem.
105
- {'\n'}
106
- {'\n'}
107
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
108
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
109
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
110
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
111
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
112
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit
113
- metus, id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
114
- {'\n'}
115
- {'\n'}
116
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
117
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
118
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
119
- tristique turpis ligula, quis interdum tellus vehicula semper. sMorbi at rutrum sem.
120
- {'\n'}
121
- {'\n'}
122
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor lobortis lacus, et dignissim tortor
123
- consectetur vitae. Donec dapibus tincidunt rutrum. Nullam luctus sollicitudin urna, sit amet tempor dolor
124
- feugiat placerat. Vivamus aliquam ante quam, sed iaculis sapien porttitor sed. Maecenas sed ex eu mi vulputate
125
- gravida. Aenean placerat nisl cursus augue vulputate tristique a sit amet massa. Maecenas imperdiet varius
126
- tortor, sit amet viverra libero egestas at. Fusce mattis porttitor accumsan. Quisque aliquet enim turpis, eu
127
- molestie nisl tempus at. Curabitur elementum consequat lectus id scelerisque. Vestibulum aliquam suscipit
128
- metus, id consectetur quam congue nec. Morbi a ligula tempor quam convallis vestibulum ac non nibh.
129
- {'\n'}
130
- {'\n'}
131
- Morbi mollis, est eu tincidunt tincidunt, odio lectus facilisis tellus, nec euismod ipsum erat quis libero.
132
- Morbi molestie erat eu hendrerit tincidunt. Sed ornare consequat maximus. Morbi tellus metus, tincidunt non
133
- auctor eu, bibendum at lorem. Vivamus congue auctor lacus, a rhoncus felis placerat sit amet. Vestibulum
134
- tristique turpis ligula, quis interdum tellus vehicula semper. Morbi at rutrum sem.
135
- </Text>
136
- </View>
137
- </FloatingContainer>
138
- ),
139
- };
@@ -1,65 +0,0 @@
1
- import { View } from 'react-native';
2
-
3
- import { Footer } from '../components';
4
-
5
- import type { FooterProps } from '../configs/types';
6
-
7
- export default {
8
- title: 'Footer',
9
- component: Footer,
10
- };
11
-
12
- const defaultTabs: FooterProps['tabs'] = [
13
- {
14
- onPress: () => {},
15
- text: 'Inicio',
16
- icon: 'home-outline',
17
- },
18
- {
19
- onPress: () => {},
20
- text: 'Contrataciones',
21
- icon: 'person-outline',
22
- badge: 1,
23
- },
24
- {
25
- onPress: () => {},
26
- text: 'Historial',
27
- icon: 'receipt-outline',
28
- },
29
- ];
30
-
31
- const invertedTabs: FooterProps['tabs'] = [
32
- {
33
- onPress: () => {},
34
- text: 'Inicio',
35
- icon: 'home-outline',
36
- },
37
- {
38
- onPress: () => {},
39
- text: 'En progreso',
40
- icon: 'flag-outline',
41
- badge: 1,
42
- },
43
- {
44
- onPress: () => {},
45
- text: 'Programados',
46
- icon: 'calendar-outline',
47
- badge: 2,
48
- },
49
- {
50
- onPress: () => {},
51
- text: 'Chat',
52
- icon: 'chatbubble-outline',
53
- badge: 19,
54
- },
55
- ];
56
-
57
- export const Default = {
58
- render: () => (
59
- <>
60
- <Footer tabs={defaultTabs} />
61
- <View style={{ marginVertical: 20 }} />
62
- <Footer tabs={invertedTabs} inverted />
63
- </>
64
- ),
65
- };
@@ -1,37 +0,0 @@
1
- import { Ionicons } from '@expo/vector-icons';
2
- import { TouchableOpacity, View } from 'react-native';
3
-
4
- import { Header } from '../components';
5
- import { Colors } from '../configs/constants';
6
-
7
- export default {
8
- title: 'Header',
9
- component: Header,
10
- };
11
-
12
- export const Default = {
13
- render: () => (
14
- <>
15
- <Header
16
- logo={{ uri: 'https://picsum.photos/200/100?random=1' }}
17
- onMenuPress={() => {}}
18
- right={
19
- <TouchableOpacity onPress={() => {}}>
20
- <Ionicons name="notifications-outline" color={Colors.darkblue} size={26} />
21
- </TouchableOpacity>
22
- }
23
- />
24
- <View style={{ marginVertical: 20 }} />
25
- <Header
26
- logo={{ uri: 'https://picsum.photos/200/100?random=2' }}
27
- inverted
28
- onMenuPress={() => {}}
29
- right={
30
- <TouchableOpacity onPress={() => {}}>
31
- <Ionicons name="notifications-outline" color={Colors.white} size={26} />
32
- </TouchableOpacity>
33
- }
34
- />
35
- </>
36
- ),
37
- };
@@ -1,14 +0,0 @@
1
- import { Button, ImagePicker, Text } from '../components';
2
-
3
- export default {
4
- title: 'Image Picker',
5
- component: ImagePicker,
6
- };
7
-
8
- export const Default = {
9
- render: () => (
10
- <Button onPress={ImagePicker}>
11
- <Text color="white">Pick an image from library</Text>
12
- </Button>
13
- ),
14
- };
@@ -1,18 +0,0 @@
1
- import { ImageResponsive } from '../components';
2
-
3
- export default {
4
- title: 'Image Responsive',
5
- component: ImageResponsive,
6
- };
7
-
8
- export const Default = {
9
- render: () => (
10
- <ImageResponsive source={{ uri: 'https://picsum.photos/id/237/300' }} style={{ height: 200, width: 200 }} />
11
- ),
12
- };
13
-
14
- export const Avatar = {
15
- render: () => (
16
- <ImageResponsive avatar source={{ uri: 'https://picsum.photos/id/237/300' }} style={{ height: 200, width: 200 }} />
17
- ),
18
- };
@@ -1,24 +0,0 @@
1
- import { ImageViewer, Text } from '../components';
2
-
3
- export default {
4
- title: 'Image Viewer',
5
- component: ImageViewer,
6
- };
7
-
8
- export const Default = {
9
- render: () => (
10
- <>
11
- <Text>Tap on the image</Text>
12
- <ImageViewer source={{ uri: 'https://picsum.photos/id/237/300' }} style={{ height: 200, width: 200 }} />
13
- </>
14
- ),
15
- };
16
-
17
- export const Avatar = {
18
- render: () => (
19
- <>
20
- <Text>Tap on the image</Text>
21
- <ImageViewer avatar source={{ uri: 'https://picsum.photos/id/237/300' }} style={{ height: 200, width: 200 }} />
22
- </>
23
- ),
24
- };