@draftbit/core 46.8.2-feb14e.2 → 46.8.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 (186) hide show
  1. package/lib/commonjs/components/Justification.js +1 -5
  2. package/lib/commonjs/components/ResizeMode.js +1 -5
  3. package/lib/module/components/Justification.js +0 -1
  4. package/lib/module/components/ResizeMode.js +0 -1
  5. package/package.json +4 -5
  6. package/lib/commonjs/mappings/HtmlElements.js +0 -175
  7. package/lib/module/mappings/HtmlElements.js +0 -168
  8. package/lib/typescript/src/mappings/HtmlElements.d.ts +0 -73
  9. package/lib/typescript/src/mappings/HtmlElements.d.ts.map +0 -1
  10. package/src/Provider.js +0 -9
  11. package/src/components/Accordion/AccordionGroup.js +0 -44
  12. package/src/components/Accordion/AccordionItem.js +0 -32
  13. package/src/components/Accordion/index.js +0 -2
  14. package/src/components/ActionSheet/ActionSheet.js +0 -45
  15. package/src/components/ActionSheet/ActionSheetCancel.js +0 -6
  16. package/src/components/ActionSheet/ActionSheetItem.js +0 -30
  17. package/src/components/ActionSheet/index.js +0 -3
  18. package/src/components/AnimatedCircularProgress.js +0 -43
  19. package/src/components/AspectRatio.js +0 -18
  20. package/src/components/AvatarEdit.js +0 -30
  21. package/src/components/Banner.js +0 -109
  22. package/src/components/Button.js +0 -114
  23. package/src/components/Card.js +0 -57
  24. package/src/components/Checkbox/Checkbox.js +0 -62
  25. package/src/components/Checkbox/CheckboxGroup.js +0 -21
  26. package/src/components/Checkbox/CheckboxGroupRow.js +0 -76
  27. package/src/components/Checkbox/CheckboxRow.js +0 -77
  28. package/src/components/Checkbox/context.js +0 -14
  29. package/src/components/Checkbox/index.js +0 -3
  30. package/src/components/CircleImage.js +0 -8
  31. package/src/components/CircularProgress.js +0 -81
  32. package/src/components/Config.js +0 -64
  33. package/src/components/Container.js +0 -43
  34. package/src/components/DatePicker/DatePicker.js +0 -382
  35. package/src/components/DatePicker/DatePickerComponent.js +0 -13
  36. package/src/components/DatePicker/DatePickerComponent.web.js +0 -30
  37. package/src/components/DatePicker/DatePickerComponentType.js +0 -1
  38. package/src/components/DeckSwiper/DeckSwiper.js +0 -65
  39. package/src/components/DeckSwiper/DeckSwiperCard.js +0 -21
  40. package/src/components/DeckSwiper/index.js +0 -2
  41. package/src/components/DeprecatedButton.js +0 -83
  42. package/src/components/DeprecatedCardWrapper.js +0 -18
  43. package/src/components/DeprecatedFAB.js +0 -114
  44. package/src/components/Divider.js +0 -13
  45. package/src/components/Elevation.js +0 -20
  46. package/src/components/FAB.js +0 -46
  47. package/src/components/FieldSearchBarFull.js +0 -53
  48. package/src/components/FormRow.js +0 -19
  49. package/src/components/IconButton.js +0 -35
  50. package/src/components/Image.js +0 -47
  51. package/src/components/Justification.js +0 -1
  52. package/src/components/Layout.js +0 -50
  53. package/src/components/NumberInput.js +0 -49
  54. package/src/components/Picker/Picker.js +0 -266
  55. package/src/components/Picker/PickerComponent.android.js +0 -69
  56. package/src/components/Picker/PickerComponent.ios.js +0 -79
  57. package/src/components/Picker/PickerComponent.web.js +0 -70
  58. package/src/components/Picker/PickerTypes.js +0 -1
  59. package/src/components/Portal/Portal.js +0 -35
  60. package/src/components/Portal/PortalConsumer.js +0 -27
  61. package/src/components/Portal/PortalHost.js +0 -107
  62. package/src/components/Portal/PortalManager.js +0 -32
  63. package/src/components/Pressable.js +0 -12
  64. package/src/components/ProgressBar.js +0 -118
  65. package/src/components/ProgressCircle.js +0 -13
  66. package/src/components/ProgressIndicator.js +0 -27
  67. package/src/components/RadioButton/RadioButton.js +0 -17
  68. package/src/components/RadioButton/RadioButtonFieldGroup.js +0 -17
  69. package/src/components/RadioButton/RadioButtonGroup.js +0 -43
  70. package/src/components/RadioButton/RadioButtonRow.js +0 -76
  71. package/src/components/RadioButton/context.js +0 -14
  72. package/src/components/RadioButton/index.js +0 -4
  73. package/src/components/ResizeMode.js +0 -1
  74. package/src/components/Row.js +0 -48
  75. package/src/components/RowBodyIcon.js +0 -8
  76. package/src/components/RowHeadlineImageCaption.js +0 -12
  77. package/src/components/RowHeadlineImageIcon.js +0 -14
  78. package/src/components/SVG.js +0 -13
  79. package/src/components/ScreenContainer.js +0 -35
  80. package/src/components/Slider.js +0 -63
  81. package/src/components/StarRating.js +0 -50
  82. package/src/components/StepIndicator.js +0 -346
  83. package/src/components/Stepper.js +0 -41
  84. package/src/components/Surface.js +0 -32
  85. package/src/components/Swiper/Swiper.js +0 -29
  86. package/src/components/Swiper/SwiperItem.js +0 -9
  87. package/src/components/Swiper/index.js +0 -2
  88. package/src/components/Switch.js +0 -56
  89. package/src/components/Text.js +0 -33
  90. package/src/components/TextField.js +0 -428
  91. package/src/components/ToggleButton.js +0 -39
  92. package/src/components/Touchable.js +0 -12
  93. package/src/components/Touchable.web.js +0 -2
  94. package/src/components/Typography.js +0 -36
  95. package/src/components/useAuthState.js +0 -31
  96. package/src/constants.js +0 -10
  97. package/src/hooks.js +0 -12
  98. package/src/index.js +0 -46
  99. package/src/interfaces/Icon.js +0 -8
  100. package/src/mappings/Accordion.js +0 -50
  101. package/src/mappings/AccordionItem.js +0 -17
  102. package/src/mappings/ActionSheet.js +0 -14
  103. package/src/mappings/ActionSheetCancel.js +0 -20
  104. package/src/mappings/ActionSheetItem.js +0 -24
  105. package/src/mappings/ActivityIndicator.js +0 -58
  106. package/src/mappings/AudioPlayer.js +0 -57
  107. package/src/mappings/AvatarEdit.js +0 -38
  108. package/src/mappings/Banner.js +0 -32
  109. package/src/mappings/BlurView.js +0 -42
  110. package/src/mappings/Button.js +0 -116
  111. package/src/mappings/Card.js +0 -52
  112. package/src/mappings/CardBlock.js +0 -123
  113. package/src/mappings/CardContainer.js +0 -104
  114. package/src/mappings/CardContainerRating.js +0 -126
  115. package/src/mappings/CardContainerShortImage.js +0 -120
  116. package/src/mappings/CardInline.js +0 -52
  117. package/src/mappings/Carousel.js +0 -19
  118. package/src/mappings/Checkbox.js +0 -46
  119. package/src/mappings/CheckboxGroup.js +0 -26
  120. package/src/mappings/CheckboxRow.js +0 -61
  121. package/src/mappings/CircleImage.js +0 -25
  122. package/src/mappings/Container.js +0 -30
  123. package/src/mappings/CustomCode.js +0 -8
  124. package/src/mappings/DatePicker.js +0 -182
  125. package/src/mappings/DeckSwiper.js +0 -48
  126. package/src/mappings/DeckSwiperCard.js +0 -16
  127. package/src/mappings/Divider.js +0 -27
  128. package/src/mappings/FAB.js +0 -37
  129. package/src/mappings/Fetch.js +0 -13
  130. package/src/mappings/FieldSearchBarFull.js +0 -50
  131. package/src/mappings/FlashList.js +0 -113
  132. package/src/mappings/FlatList.js +0 -51
  133. package/src/mappings/HeaderLarge.js +0 -29
  134. package/src/mappings/HeaderMedium.js +0 -55
  135. package/src/mappings/HeaderOverline.js +0 -55
  136. package/src/mappings/HtmlElements.js +0 -191
  137. package/src/mappings/HtmlElements.ts +0 -204
  138. package/src/mappings/Icon.js +0 -32
  139. package/src/mappings/IconButton.js +0 -33
  140. package/src/mappings/Image.js +0 -35
  141. package/src/mappings/ImageBackground.js +0 -29
  142. package/src/mappings/KeyboardAvoidingView.js +0 -41
  143. package/src/mappings/KeyboardAwareScrollView.js +0 -50
  144. package/src/mappings/Layout.js +0 -200
  145. package/src/mappings/LinearGradient.js +0 -82
  146. package/src/mappings/MapCallout.js +0 -22
  147. package/src/mappings/MapMarker.js +0 -48
  148. package/src/mappings/MapView.js +0 -142
  149. package/src/mappings/Modal.js +0 -42
  150. package/src/mappings/NumberInput.js +0 -254
  151. package/src/mappings/Picker.js +0 -153
  152. package/src/mappings/ProgressBar.js +0 -101
  153. package/src/mappings/ProgressCircle.js +0 -109
  154. package/src/mappings/ProgressIndicator.js +0 -181
  155. package/src/mappings/RadioButton.js +0 -51
  156. package/src/mappings/RadioButtonGroup.js +0 -17
  157. package/src/mappings/RadioButtonRow.js +0 -42
  158. package/src/mappings/RowBodyIcon.js +0 -75
  159. package/src/mappings/RowHeadlineImageCaption.js +0 -167
  160. package/src/mappings/RowHeadlineImageIcon.js +0 -99
  161. package/src/mappings/SVG.js +0 -20
  162. package/src/mappings/SafeAreaView.js +0 -33
  163. package/src/mappings/ScrollView.js +0 -37
  164. package/src/mappings/Slider.js +0 -60
  165. package/src/mappings/StarRating.js +0 -43
  166. package/src/mappings/Stepper.js +0 -32
  167. package/src/mappings/Surface.js +0 -14
  168. package/src/mappings/Swiper.js +0 -71
  169. package/src/mappings/SwiperItem.js +0 -9
  170. package/src/mappings/Switch.js +0 -81
  171. package/src/mappings/Text.js +0 -251
  172. package/src/mappings/TextArea.js +0 -283
  173. package/src/mappings/TextField.js +0 -400
  174. package/src/mappings/TextInput.js +0 -402
  175. package/src/mappings/ToggleButton.js +0 -50
  176. package/src/mappings/Touchable.js +0 -67
  177. package/src/mappings/Video.js +0 -81
  178. package/src/mappings/View.js +0 -207
  179. package/src/mappings/WebView.js +0 -88
  180. package/src/styles/DarkTheme.js +0 -26
  181. package/src/styles/DefaultTheme.js +0 -111
  182. package/src/styles/fonts.js +0 -62
  183. package/src/styles/overlay.js +0 -60
  184. package/src/styles/shadow.js +0 -51
  185. package/src/theming.js +0 -3
  186. package/src/utilities.js +0 -102
@@ -1,65 +0,0 @@
1
- import React from "react";
2
- import { StyleSheet, View } from "react-native";
3
- import DeckSwiperComponent from "react-native-deck-swiper";
4
- const DeckSwiper = ({ onIndexChanged, onEndReached, startCardIndex = 0, infiniteSwiping = false, verticalEnabled = true, horizontalEnabled = true, visibleCardCount = 1, data, keyExtractor, renderItem, style, children, }) => {
5
- //Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
6
- if ((data && !renderItem) || (renderItem && !data)) {
7
- throw new Error("'renderItem' and 'data' need to both be provided to lazily render. Either remove them entirley or include both");
8
- }
9
- if (data && renderItem && children) {
10
- console.warn("'children' of DeckSwiper ignored due to usage of 'data' and 'renderItem'");
11
- }
12
- const childrenArray = React.useMemo(() => React.Children.toArray(children), [children]);
13
- // an array of indices based on children count
14
- const cardsFillerData = React.useMemo(() => Array.from(Array(childrenArray.length).keys()), [childrenArray]);
15
- const cardsData = data || cardsFillerData;
16
- const renderCard = (card, index) => {
17
- if (renderItem) {
18
- return renderItem({ item: card, index });
19
- }
20
- else {
21
- return React.createElement(React.Fragment, null, childrenArray[index]);
22
- }
23
- };
24
- const renderFirstCard = () => {
25
- if (cardsData.length) {
26
- return renderCard(cardsData[0], 0);
27
- }
28
- return undefined;
29
- };
30
- const cardKeyExtractor = (card) => {
31
- if (keyExtractor) {
32
- return keyExtractor(card);
33
- }
34
- else {
35
- return card === null || card === void 0 ? void 0 : card.toString();
36
- }
37
- };
38
- /**
39
- * By default react-native-deck-swiper positions everything with absolute position.
40
- * To overcome this, it is wrapped in a View to be able to add the component in any layout structure.
41
- *
42
- *
43
- * Since all children of that View are absolutley positioned, the View does not have a height and still looks and behaves weird.
44
- * To fix/mitage this without setting a static height, the first card is rendered in invisible state to take up space.
45
- * This effectivley makes the default height of the container be the height of the first card.
46
- */
47
- return (React.createElement(View, null,
48
- React.createElement(View, { style: styles.containerHeightFiller }, renderFirstCard()),
49
- React.createElement(DeckSwiperComponent, { cards: cardsData, renderCard: renderCard, keyExtractor: cardKeyExtractor, containerStyle: StyleSheet.flatten([styles.cardsContainer, style]), cardStyle: styles.card, onSwiped: onIndexChanged, onSwipedAll: onEndReached, cardIndex: startCardIndex, infinite: infiniteSwiping, verticalSwipe: verticalEnabled, horizontalSwipe: horizontalEnabled, showSecondCard: visibleCardCount > 1, stackSize: visibleCardCount, backgroundColor: "transparent", cardVerticalMargin: 0, cardHorizontalMargin: 0 })));
50
- };
51
- const styles = StyleSheet.create({
52
- cardsContainer: {
53
- width: "100%",
54
- },
55
- card: {
56
- left: 0,
57
- right: 0,
58
- width: "auto",
59
- height: "auto",
60
- },
61
- containerHeightFiller: {
62
- opacity: 0.0,
63
- },
64
- });
65
- export default DeckSwiper;
@@ -1,21 +0,0 @@
1
- import React from "react";
2
- import { View, StyleSheet } from "react-native";
3
- import { withTheme } from "../../theming";
4
- const DeckSwiperCard = ({ style, children, theme }) => (React.createElement(View, { style: [
5
- styles.card,
6
- {
7
- backgroundColor: theme.colors.background,
8
- borderColor: theme.colors.divider,
9
- },
10
- style,
11
- ] }, children));
12
- const styles = StyleSheet.create({
13
- card: {
14
- flex: 1,
15
- alignItems: "center",
16
- justifyContent: "center",
17
- padding: 20,
18
- borderWidth: 2,
19
- },
20
- });
21
- export default withTheme(DeckSwiperCard);
@@ -1,2 +0,0 @@
1
- export { default as DeckSwiper } from "./DeckSwiper";
2
- export { default as DeckSwiperCard } from "./DeckSwiperCard";
@@ -1,83 +0,0 @@
1
- import * as React from "react";
2
- import { ActivityIndicator, View, Text, StyleSheet, Pressable, } from "react-native";
3
- import color from "color";
4
- import Config from "./Config";
5
- import Elevation from "./Elevation";
6
- import { withTheme } from "../theming";
7
- const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false, labelColor, color: colorOverride, children, onPress, elevation = 0, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
8
- let backgroundColor, borderColor, textColor, borderWidth;
9
- const buttonColor = colorOverride || colors.primary;
10
- if (type === "solid") {
11
- backgroundColor = buttonColor;
12
- if (disabled) {
13
- textColor = color(colors.surface).alpha(disabledOpacity).rgb().string();
14
- }
15
- else {
16
- textColor = labelColor || colors.surface;
17
- }
18
- }
19
- else {
20
- backgroundColor = "transparent";
21
- if (disabled) {
22
- textColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
23
- }
24
- else {
25
- textColor = labelColor || buttonColor;
26
- }
27
- }
28
- if (type === "outline") {
29
- if (disabled) {
30
- borderColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
31
- }
32
- else {
33
- borderColor = buttonColor;
34
- }
35
- borderWidth = StyleSheet.hairlineWidth;
36
- }
37
- else {
38
- borderColor = "transparent";
39
- borderWidth = 0;
40
- }
41
- const buttonStyle = {
42
- backgroundColor,
43
- borderColor,
44
- borderWidth,
45
- borderRadius: roundness,
46
- };
47
- const textStyle = {
48
- textAlign: "center",
49
- color: textColor,
50
- marginVertical: 16,
51
- marginHorizontal: 16,
52
- };
53
- const iconStyle = [
54
- styles.icon,
55
- {
56
- marginLeft: 16,
57
- marginRight: -8,
58
- width: Config.buttonIconSize,
59
- },
60
- ];
61
- return (React.createElement(Elevation, { style: { elevation, alignSelf: "stretch" } },
62
- React.createElement(Pressable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: [styles.button, buttonStyle] },
63
- React.createElement(View, { style: styles.content },
64
- icon && loading !== true ? (React.createElement(View, { style: iconStyle },
65
- React.createElement(Icon, { name: icon, size: Config.buttonIconSize, color: textColor }))) : null,
66
- loading ? (React.createElement(ActivityIndicator, { size: "small", color: textColor, style: iconStyle })) : null,
67
- React.createElement(Text, { numberOfLines: 1, style: [textStyle, typography.button] }, children)))));
68
- };
69
- const styles = StyleSheet.create({
70
- button: {
71
- minWidth: 64,
72
- borderStyle: "solid",
73
- },
74
- content: {
75
- flexDirection: "row",
76
- alignItems: "center",
77
- justifyContent: "center",
78
- },
79
- icon: {
80
- width: Config.buttonIconSize,
81
- },
82
- });
83
- export default withTheme(Button);
@@ -1,18 +0,0 @@
1
- import React from "react";
2
- import { withTheme } from "../theming";
3
- import Touchable from "./Touchable";
4
- const getWidth = (numColumns) => {
5
- switch (numColumns) {
6
- case 1:
7
- return "33%";
8
- case 2:
9
- return "50%";
10
- default:
11
- return "100%";
12
- }
13
- };
14
- const Card = ({ numColumns = 3, children, onPress, style, ...rest }) => {
15
- const width = getWidth(numColumns);
16
- return (React.createElement(Touchable, { disabled: !onPress, onPress: onPress, style: [style, { width }], ...rest }, children));
17
- };
18
- export default withTheme(Card);
@@ -1,114 +0,0 @@
1
- import * as React from "react";
2
- import { ActivityIndicator, View, StyleSheet, Pressable, } from "react-native";
3
- import color from "color";
4
- import Config from "./Config";
5
- import Text from "./Text";
6
- import Elevation from "./Elevation";
7
- import { withTheme } from "../theming";
8
- const FAB = ({ Icon, icon, disabled = false, type = "solid", loading = false, color: colorOverride, label, onPress, elevation = 0, style, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
9
- let backgroundColor, borderColor, textColor, borderWidth;
10
- const buttonColor = colorOverride || colors.primary;
11
- if (type === "standard" || type === "extended" || type === "fixed") {
12
- backgroundColor = buttonColor;
13
- if (disabled) {
14
- textColor = color(colors.surface).alpha(disabledOpacity).rgb().string();
15
- }
16
- else {
17
- textColor = colors.surface;
18
- }
19
- }
20
- else {
21
- backgroundColor = "transparent";
22
- if (disabled) {
23
- textColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
24
- }
25
- else {
26
- textColor = buttonColor;
27
- }
28
- }
29
- if (type === "outline") {
30
- if (disabled) {
31
- borderColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
32
- }
33
- else {
34
- borderColor = buttonColor;
35
- }
36
- borderWidth = StyleSheet.hairlineWidth;
37
- }
38
- else {
39
- borderColor = "transparent";
40
- borderWidth = 0;
41
- }
42
- const buttonStyle = {
43
- backgroundColor,
44
- borderColor,
45
- borderWidth,
46
- borderRadius: roundness,
47
- alignItems: "center",
48
- justifyContent: "center",
49
- };
50
- const buttonStyles = [styles.button, buttonStyle];
51
- const contentStyle = [styles.content];
52
- const textStyle = {
53
- textAlign: "center",
54
- color: textColor,
55
- };
56
- const iconStyle = [
57
- styles.icon,
58
- {
59
- width: Config.buttonIconSize,
60
- },
61
- ];
62
- if (type === "standard" || type === "outline") {
63
- buttonStyle.width = Config.FABSize;
64
- buttonStyle.height = Config.FABSize;
65
- buttonStyle.borderRadius = Config.FABBorderRadius;
66
- contentStyle.push({
67
- width: Config.FABSize,
68
- height: Config.FABSize,
69
- });
70
- }
71
- if (type === "extended" || type === "fixed") {
72
- iconStyle.push({
73
- marginLeft: 16,
74
- marginRight: -8,
75
- });
76
- textStyle.margin = 16;
77
- }
78
- if (type === "fixed") {
79
- buttonStyles.push({
80
- height: Config.FABFixedHeight,
81
- alignSelf: "stretch",
82
- });
83
- }
84
- return (React.createElement(Elevation, { style: [{ elevation }, style] },
85
- React.createElement(Pressable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: buttonStyles },
86
- React.createElement(View, { style: styles.content },
87
- icon && loading !== true ? (React.createElement(View, { style: iconStyle },
88
- React.createElement(Icon, { name: icon, size: Config.buttonIconSize, color: textColor }))) : null,
89
- loading ? (React.createElement(ActivityIndicator, { size: "small", color: textColor, style: iconStyle })) : null,
90
- label ? (React.createElement(Text, { numberOfLines: 1, style: [textStyle, typography.button] }, label)) : null))));
91
- };
92
- const styles = StyleSheet.create({
93
- button: {
94
- borderStyle: "solid",
95
- },
96
- content: {
97
- flexDirection: "row",
98
- alignItems: "center",
99
- justifyContent: "center",
100
- },
101
- icon: {
102
- alignItems: "center",
103
- justifyContent: "center",
104
- width: Config.buttonIconSize,
105
- },
106
- fixed: {
107
- left: 0,
108
- right: 0,
109
- bottom: 0,
110
- height: 64,
111
- borderRadius: 0,
112
- },
113
- });
114
- export default withTheme(FAB);
@@ -1,13 +0,0 @@
1
- import * as React from "react";
2
- import { StyleSheet, View } from "react-native";
3
- import { withTheme } from "../theming";
4
- const Divider = ({ style, color, theme: { colors }, ...rest }) => {
5
- return (React.createElement(View, { style: [
6
- {
7
- backgroundColor: color || colors.divider,
8
- height: StyleSheet.hairlineWidth,
9
- },
10
- style,
11
- ], ...rest }));
12
- };
13
- export default withTheme(Divider);
@@ -1,20 +0,0 @@
1
- import * as React from "react";
2
- import { Animated, StyleSheet, View, } from "react-native";
3
- import shadow from "../styles/shadow";
4
- import { withTheme } from "../theming";
5
- /* directly copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx#L62 */
6
- const Elevation = ({ style, theme, children, ...rest }) => {
7
- const { elevation = 4, borderRadius: radius } = StyleSheet.flatten(style) || {};
8
- const { colors } = theme;
9
- const borderRadius = radius;
10
- return (React.createElement(Animated.View, { ...rest, style: [
11
- {
12
- borderRadius,
13
- backgroundColor: colors.surface,
14
- },
15
- elevation ? shadow(elevation) : null,
16
- style,
17
- ] },
18
- React.createElement(View, { style: { overflow: "hidden", borderRadius } }, children)));
19
- };
20
- export default withTheme(Elevation);
@@ -1,46 +0,0 @@
1
- import * as React from "react";
2
- import { View, StyleSheet, Pressable, ActivityIndicator, Platform, } from "react-native";
3
- import { withTheme } from "../theming";
4
- const FAB = ({ onPress, disabled, loading, iconName = "MaterialIcons/add", style, theme, iconColor, bgColor, size = 50, Icon, ...props }) => {
5
- const backgroundColor = bgColor || theme.colors.primary;
6
- const color = iconColor || "#FFF";
7
- return (React.createElement(View, { style: [
8
- {
9
- width: size,
10
- height: size,
11
- borderRadius: size / 2,
12
- overflow: "hidden",
13
- },
14
- style,
15
- ] },
16
- React.createElement(Pressable, { onPress: onPress, disabled: loading || disabled, android_ripple: {
17
- color: "#333",
18
- radius: size / 4,
19
- }, style: ({ pressed }) => {
20
- return [
21
- styles.button,
22
- {
23
- opacity: pressed || disabled ? 0.75 : 1,
24
- width: size,
25
- height: size,
26
- borderRadius: size / 2,
27
- backgroundColor,
28
- },
29
- ];
30
- }, ...props },
31
- React.createElement(View, null, loading ? (React.createElement(ActivityIndicator, { style: size > 50 ? { marginTop: 2, marginLeft: 2 } : undefined, size: size <= 50 ? "small" : "large", color: color })) : (React.createElement(Icon, { name: iconName, size: size, color: color }))))));
32
- };
33
- const styles = StyleSheet.create({
34
- button: {
35
- backgroundColor: "#5a45ff",
36
- justifyContent: "center",
37
- alignItems: "center",
38
- ...Platform.select({
39
- web: {
40
- cursor: "pointer",
41
- userSelect: "none",
42
- },
43
- }),
44
- },
45
- });
46
- export default withTheme(FAB);
@@ -1,53 +0,0 @@
1
- import * as React from "react";
2
- import { View, TextInput, StyleSheet, } from "react-native";
3
- import { withTheme } from "../theming";
4
- import Config from "./Config";
5
- const FieldSearchBarFull = ({ showIcon, Icon, icon = "search", placeholder = "", style, theme: { colors, typography }, onChange: changeOverride, onSubmit: submitOverride, value, defaultValue, }) => {
6
- const [focused, setIsFocused] = React.useState(false);
7
- const onBlur = () => {
8
- setIsFocused(false);
9
- };
10
- const [internalValue, setInternalValue] = React.useState(value || defaultValue);
11
- React.useEffect(() => {
12
- if (value != null) {
13
- setInternalValue(value);
14
- }
15
- }, [value]);
16
- React.useEffect(() => {
17
- if (defaultValue != null) {
18
- setInternalValue(defaultValue);
19
- }
20
- }, [defaultValue]);
21
- const onChange = React.useCallback((text) => {
22
- changeOverride && changeOverride(text);
23
- }, [changeOverride]);
24
- const onFocus = () => {
25
- setIsFocused(true);
26
- };
27
- const onSubmit = (e) => {
28
- submitOverride && submitOverride(e);
29
- };
30
- const { lineHeight, ...typeStyles } = typography.body2; // eslint-disable-line @typescript-eslint/no-unused-vars
31
- const handleChangeText = (newValue) => {
32
- setInternalValue(newValue);
33
- if (onChange) {
34
- onChange(newValue);
35
- }
36
- };
37
- return (React.createElement(View, { style: [styles.container, style] },
38
- showIcon && (React.createElement(Icon, { name: icon, size: Config.fieldSearchBarFullIconSize, color: focused ? colors.primary : colors.light })),
39
- React.createElement(View, { style: { marginLeft: showIcon ? 12 : 0, flex: 1 } },
40
- React.createElement(TextInput, { clearButtonMode: "while-editing", placeholder: placeholder, value: internalValue, onBlur: onBlur, onFocus: onFocus, onChangeText: handleChangeText, onSubmitEditing: onSubmit, placeholderTextColor: colors.light, style: [
41
- {
42
- color: colors.medium,
43
- },
44
- typeStyles,
45
- ] }))));
46
- };
47
- const styles = StyleSheet.create({
48
- container: {
49
- flexDirection: "row",
50
- alignItems: "center",
51
- },
52
- });
53
- export default withTheme(FieldSearchBarFull);
@@ -1,19 +0,0 @@
1
- import * as React from "react";
2
- import { Text, StyleSheet } from "react-native";
3
- import { extractStyles } from "../utilities";
4
- import Touchable from "./Touchable";
5
- export default function FormRow({ disabled, direction, children, label, style, onPress, ...rest }) {
6
- const { textStyles, viewStyles } = extractStyles(style);
7
- return (React.createElement(Touchable, { disabled: disabled, onPress: onPress, style: [styles.row, { flexDirection: direction }, viewStyles], ...rest },
8
- React.createElement(Text, { style: textStyles }, label),
9
- children));
10
- }
11
- const styles = StyleSheet.create({
12
- row: {
13
- marginLeft: 8,
14
- marginRight: 8,
15
- flexDirection: "row",
16
- justifyContent: "space-between",
17
- alignItems: "center",
18
- },
19
- });
@@ -1,35 +0,0 @@
1
- import * as React from "react";
2
- import { View, StyleSheet, ActivityIndicator, Pressable, Platform, } from "react-native";
3
- import { withTheme } from "../theming";
4
- const IconButton = ({ Icon, icon, color: customColor, size = 32, disabled, loading = false, onPress, theme, style, activeOpacity = 0.8, disabledOpacity = 0.8, ...props }) => {
5
- const iconColor = customColor || theme.colors.primary;
6
- return (React.createElement(Pressable, { onPress: onPress, disabled: disabled || loading, style: ({ pressed }) => {
7
- return [
8
- styles.container,
9
- {
10
- opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
11
- width: size,
12
- height: size,
13
- alignItems: "center",
14
- justifyContent: "center",
15
- },
16
- style,
17
- ];
18
- }, ...props },
19
- React.createElement(View, null,
20
- icon && !loading ? (React.createElement(Icon, { name: icon, size: size - 2, color: iconColor })) : null,
21
- loading ? React.createElement(ActivityIndicator, { size: "small", color: iconColor }) : null)));
22
- };
23
- const styles = StyleSheet.create({
24
- container: {
25
- alignItems: "center",
26
- justifyContent: "center",
27
- ...Platform.select({
28
- web: {
29
- cursor: "pointer",
30
- userSelect: "none",
31
- },
32
- }),
33
- },
34
- });
35
- export default withTheme(IconButton);
@@ -1,47 +0,0 @@
1
- /* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
2
- import React from "react";
3
- import { Image as NativeImage, StyleSheet, } from "react-native";
4
- import Config from "./Config";
5
- import AspectRatio from "./AspectRatio";
6
- const generateDimensions = ({ aspectRatio, width, height }) => {
7
- if (aspectRatio && !width && !height) {
8
- return {
9
- aspectRatio,
10
- width: "100%",
11
- };
12
- }
13
- if (aspectRatio && height) {
14
- return {
15
- aspectRatio,
16
- height,
17
- width: aspectRatio * height,
18
- };
19
- }
20
- if (aspectRatio && width) {
21
- return {
22
- aspectRatio,
23
- width,
24
- height: width / aspectRatio,
25
- };
26
- }
27
- return { width, height };
28
- };
29
- const Image = ({ source, resizeMode = "cover", style, ...props }) => {
30
- let imageSource = source === null || source === undefined
31
- ? Config.placeholderImageURL
32
- : source;
33
- const styles = StyleSheet.flatten(style || {});
34
- const { aspectRatio, width, height } = generateDimensions(styles);
35
- if (aspectRatio) {
36
- return (React.createElement(AspectRatio, { style: [style, { width, height, aspectRatio }] },
37
- React.createElement(NativeImage, { ...props, source: imageSource, resizeMode: resizeMode, style: [
38
- style,
39
- {
40
- height: "100%",
41
- width: "100%",
42
- },
43
- ] })));
44
- }
45
- return (React.createElement(NativeImage, { ...props, source: source, resizeMode: resizeMode, style: style }));
46
- };
47
- export default Image;
@@ -1 +0,0 @@
1
- export {};
@@ -1,50 +0,0 @@
1
- import * as React from "react";
2
- import { View } from "react-native";
3
- export function Center({ width = 240, height = 200, children, bgColor, style, ...rest }) {
4
- return (React.createElement(View, { style: [
5
- {
6
- justifyContent: "center",
7
- alignItems: "center",
8
- width,
9
- height,
10
- backgroundColor: bgColor,
11
- },
12
- style,
13
- ], ...rest }, children));
14
- }
15
- export function Circle({ size = 50, bgColor, children, style, ...rest }) {
16
- const borderRadius = 1000;
17
- return (React.createElement(Center, { width: size, height: size, bgColor: bgColor, style: [
18
- style,
19
- { backgroundColor: bgColor, borderRadius, overflow: "hidden" },
20
- ], ...rest }, children));
21
- }
22
- export function Square({ size = 50, bgColor, children, style, ...rest }) {
23
- return (React.createElement(Center, { style: style, width: size, height: size, bgColor: bgColor, ...rest }, children));
24
- }
25
- export function Row({ justifyContent, alignItems, children, style, ...rest }) {
26
- return (React.createElement(View, { style: [
27
- style,
28
- {
29
- alignItems,
30
- flexDirection: "row",
31
- justifyContent: justifyContent,
32
- },
33
- ], ...rest }, children));
34
- }
35
- export function Spacer({ top = 8, right = 8, bottom = 8, left = 8, children, style, ...rest }) {
36
- return (React.createElement(View, { style: [
37
- style,
38
- {
39
- paddingRight: right,
40
- paddingTop: top,
41
- paddingLeft: left,
42
- paddingBottom: bottom,
43
- },
44
- ], ...rest }, children));
45
- }
46
- export function Stack({ children, justifyContent = "flex-start", alignItems = "flex-start", style, ...rest }) {
47
- return (
48
- // style must go first since we don't want justifyContent, alignItems overridden
49
- React.createElement(View, { style: [style, { justifyContent, alignItems }], ...rest }, children));
50
- }
@@ -1,49 +0,0 @@
1
- import React, { useEffect, useState } from "react";
2
- import { TextInput } from "react-native";
3
- import { isString, isNumber, isNaN } from "lodash";
4
- const NumberInput = ({ onChangeText, value, defaultValue, ...props }) => {
5
- const [currentStringNumberValue, setCurrentStringNumberValue] = useState("");
6
- const formatValueToStringNumber = (valueToFormat) => {
7
- if (valueToFormat != null) {
8
- if (isString(valueToFormat) && valueToFormat !== "") {
9
- if (/^0[1-9]$/.test(valueToFormat)) {
10
- return valueToFormat.slice(1);
11
- }
12
- else if (/^[+-]?([0-9]+\.?[0-9]*|\.[0-9]+)$/.test(valueToFormat)) {
13
- return valueToFormat;
14
- }
15
- else {
16
- return currentStringNumberValue;
17
- }
18
- }
19
- else if (isNumber(valueToFormat) && !isNaN(valueToFormat)) {
20
- return valueToFormat.toString();
21
- }
22
- }
23
- return "";
24
- };
25
- const handleChangeText = (newValue) => {
26
- const newStringNumberValue = formatValueToStringNumber(newValue);
27
- const number = parseFloat(newStringNumberValue);
28
- setCurrentStringNumberValue(newStringNumberValue);
29
- onChangeText === null || onChangeText === void 0 ? void 0 : onChangeText(number);
30
- };
31
- // run handleChangeText with value prop only when value prop changes (and first render to reset currentStringNumberValue)
32
- useEffect(() => {
33
- const nextStringNumberValue = formatValueToStringNumber(value);
34
- if (currentStringNumberValue !== nextStringNumberValue) {
35
- handleChangeText(nextStringNumberValue);
36
- }
37
- // eslint-disable-next-line react-hooks/exhaustive-deps
38
- }, [value]);
39
- // set currentStringNumberValue as defaultValue prop if there is a differnce on first render only
40
- useEffect(() => {
41
- const defaultStringNumberValue = formatValueToStringNumber(defaultValue);
42
- if (currentStringNumberValue !== defaultStringNumberValue) {
43
- setCurrentStringNumberValue(defaultStringNumberValue);
44
- }
45
- // eslint-disable-next-line react-hooks/exhaustive-deps
46
- }, []);
47
- return (React.createElement(TextInput, { keyboardType: "numeric", value: currentStringNumberValue, onChangeText: handleChangeText, ...props }));
48
- };
49
- export default NumberInput;