@draftbit/core 46.9.1-f8902c.2 → 46.9.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 (220) hide show
  1. package/lib/commonjs/components/CircleImage.js +1 -15
  2. package/lib/commonjs/components/FormRow.js +2 -16
  3. package/lib/commonjs/components/Justification.js +1 -5
  4. package/lib/commonjs/components/ResizeMode.js +1 -5
  5. package/lib/commonjs/index.js +0 -7
  6. package/lib/module/components/Justification.js +0 -1
  7. package/lib/module/components/ResizeMode.js +0 -1
  8. package/lib/module/index.js +0 -1
  9. package/lib/typescript/src/index.d.ts +0 -1
  10. package/lib/typescript/src/index.d.ts.map +1 -1
  11. package/package.json +3 -4
  12. package/src/index.tsx +0 -2
  13. package/lib/commonjs/components/BottomSheet/BottomSheet.js +0 -89
  14. package/lib/commonjs/components/BottomSheet/BottomSheetComponent.js +0 -464
  15. package/lib/commonjs/components/BottomSheet/index.js +0 -13
  16. package/lib/commonjs/mappings/BottomSheet.js +0 -75
  17. package/lib/module/components/BottomSheet/BottomSheet.js +0 -81
  18. package/lib/module/components/BottomSheet/BottomSheetComponent.js +0 -470
  19. package/lib/module/components/BottomSheet/index.js +0 -1
  20. package/lib/module/mappings/BottomSheet.js +0 -68
  21. package/lib/typescript/src/components/BottomSheet/BottomSheet.d.ts +0 -20
  22. package/lib/typescript/src/components/BottomSheet/BottomSheet.d.ts.map +0 -1
  23. package/lib/typescript/src/components/BottomSheet/BottomSheetComponent.d.ts +0 -170
  24. package/lib/typescript/src/components/BottomSheet/BottomSheetComponent.d.ts.map +0 -1
  25. package/lib/typescript/src/components/BottomSheet/index.d.ts +0 -2
  26. package/lib/typescript/src/components/BottomSheet/index.d.ts.map +0 -1
  27. package/lib/typescript/src/mappings/BottomSheet.d.ts +0 -120
  28. package/lib/typescript/src/mappings/BottomSheet.d.ts.map +0 -1
  29. package/src/Provider.js +0 -9
  30. package/src/components/Accordion/AccordionGroup.js +0 -44
  31. package/src/components/Accordion/AccordionItem.js +0 -32
  32. package/src/components/Accordion/index.js +0 -2
  33. package/src/components/ActionSheet/ActionSheet.js +0 -45
  34. package/src/components/ActionSheet/ActionSheetCancel.js +0 -6
  35. package/src/components/ActionSheet/ActionSheetItem.js +0 -30
  36. package/src/components/ActionSheet/index.js +0 -3
  37. package/src/components/AnimatedCircularProgress.js +0 -43
  38. package/src/components/AspectRatio.js +0 -18
  39. package/src/components/AvatarEdit.js +0 -30
  40. package/src/components/Banner.js +0 -109
  41. package/src/components/BottomSheet/BottomSheet.js +0 -57
  42. package/src/components/BottomSheet/BottomSheet.tsx +0 -121
  43. package/src/components/BottomSheet/BottomSheetComponent.js +0 -437
  44. package/src/components/BottomSheet/BottomSheetComponent.tsx +0 -895
  45. package/src/components/BottomSheet/index.js +0 -1
  46. package/src/components/BottomSheet/index.ts +0 -1
  47. package/src/components/Button.js +0 -114
  48. package/src/components/Card.js +0 -57
  49. package/src/components/Checkbox/Checkbox.js +0 -62
  50. package/src/components/Checkbox/CheckboxGroup.js +0 -21
  51. package/src/components/Checkbox/CheckboxGroupRow.js +0 -76
  52. package/src/components/Checkbox/CheckboxRow.js +0 -77
  53. package/src/components/Checkbox/context.js +0 -14
  54. package/src/components/Checkbox/index.js +0 -3
  55. package/src/components/CircleImage.js +0 -8
  56. package/src/components/CircularProgress.js +0 -81
  57. package/src/components/Config.js +0 -64
  58. package/src/components/Container.js +0 -43
  59. package/src/components/DatePicker/DatePicker.js +0 -382
  60. package/src/components/DatePicker/DatePickerComponent.js +0 -13
  61. package/src/components/DatePicker/DatePickerComponent.web.js +0 -30
  62. package/src/components/DatePicker/DatePickerComponentType.js +0 -1
  63. package/src/components/DeckSwiper/DeckSwiper.js +0 -65
  64. package/src/components/DeckSwiper/DeckSwiperCard.js +0 -21
  65. package/src/components/DeckSwiper/index.js +0 -2
  66. package/src/components/DeprecatedButton.js +0 -83
  67. package/src/components/DeprecatedCardWrapper.js +0 -18
  68. package/src/components/DeprecatedFAB.js +0 -114
  69. package/src/components/Divider.js +0 -13
  70. package/src/components/Elevation.js +0 -20
  71. package/src/components/FAB.js +0 -46
  72. package/src/components/FieldSearchBarFull.js +0 -53
  73. package/src/components/FormRow.js +0 -19
  74. package/src/components/IconButton.js +0 -35
  75. package/src/components/Image.js +0 -47
  76. package/src/components/Justification.js +0 -1
  77. package/src/components/Layout.js +0 -50
  78. package/src/components/Markdown.js +0 -10
  79. package/src/components/NumberInput.js +0 -49
  80. package/src/components/Picker/Picker.js +0 -266
  81. package/src/components/Picker/PickerComponent.android.js +0 -69
  82. package/src/components/Picker/PickerComponent.ios.js +0 -79
  83. package/src/components/Picker/PickerComponent.web.js +0 -70
  84. package/src/components/Picker/PickerTypes.js +0 -1
  85. package/src/components/Portal/Portal.js +0 -35
  86. package/src/components/Portal/PortalConsumer.js +0 -27
  87. package/src/components/Portal/PortalHost.js +0 -107
  88. package/src/components/Portal/PortalManager.js +0 -32
  89. package/src/components/Pressable.js +0 -12
  90. package/src/components/ProgressBar.js +0 -118
  91. package/src/components/ProgressCircle.js +0 -13
  92. package/src/components/ProgressIndicator.js +0 -27
  93. package/src/components/RadioButton/RadioButton.js +0 -17
  94. package/src/components/RadioButton/RadioButtonFieldGroup.js +0 -17
  95. package/src/components/RadioButton/RadioButtonGroup.js +0 -43
  96. package/src/components/RadioButton/RadioButtonRow.js +0 -76
  97. package/src/components/RadioButton/context.js +0 -14
  98. package/src/components/RadioButton/index.js +0 -4
  99. package/src/components/ResizeMode.js +0 -1
  100. package/src/components/Row.js +0 -48
  101. package/src/components/RowBodyIcon.js +0 -8
  102. package/src/components/RowHeadlineImageCaption.js +0 -12
  103. package/src/components/RowHeadlineImageIcon.js +0 -14
  104. package/src/components/SVG.js +0 -13
  105. package/src/components/ScreenContainer.js +0 -35
  106. package/src/components/Shadow.js +0 -16
  107. package/src/components/Slider.js +0 -63
  108. package/src/components/StarRating.js +0 -50
  109. package/src/components/StepIndicator.js +0 -346
  110. package/src/components/Stepper.js +0 -41
  111. package/src/components/Surface.js +0 -32
  112. package/src/components/Swiper/Swiper.js +0 -29
  113. package/src/components/Swiper/SwiperItem.js +0 -9
  114. package/src/components/Swiper/index.js +0 -2
  115. package/src/components/Switch.js +0 -56
  116. package/src/components/TabView/TabView.js +0 -54
  117. package/src/components/TabView/TabViewItem.js +0 -11
  118. package/src/components/TabView/index.js +0 -2
  119. package/src/components/Text.js +0 -33
  120. package/src/components/TextField.js +0 -428
  121. package/src/components/ToggleButton.js +0 -39
  122. package/src/components/Touchable.js +0 -12
  123. package/src/components/Touchable.web.js +0 -2
  124. package/src/components/Typography.js +0 -36
  125. package/src/components/useAuthState.js +0 -31
  126. package/src/constants.js +0 -10
  127. package/src/hooks.js +0 -12
  128. package/src/index.js +0 -50
  129. package/src/interfaces/Icon.js +0 -8
  130. package/src/mappings/Accordion.js +0 -50
  131. package/src/mappings/AccordionItem.js +0 -17
  132. package/src/mappings/ActionSheet.js +0 -14
  133. package/src/mappings/ActionSheetCancel.js +0 -20
  134. package/src/mappings/ActionSheetItem.js +0 -24
  135. package/src/mappings/ActivityIndicator.js +0 -58
  136. package/src/mappings/AudioPlayer.js +0 -57
  137. package/src/mappings/AvatarEdit.js +0 -38
  138. package/src/mappings/Banner.js +0 -32
  139. package/src/mappings/BlurView.js +0 -42
  140. package/src/mappings/BottomSheet.js +0 -64
  141. package/src/mappings/BottomSheet.ts +0 -78
  142. package/src/mappings/Button.js +0 -116
  143. package/src/mappings/Card.js +0 -52
  144. package/src/mappings/CardBlock.js +0 -123
  145. package/src/mappings/CardContainer.js +0 -104
  146. package/src/mappings/CardContainerRating.js +0 -126
  147. package/src/mappings/CardContainerShortImage.js +0 -120
  148. package/src/mappings/CardInline.js +0 -52
  149. package/src/mappings/Carousel.js +0 -19
  150. package/src/mappings/Checkbox.js +0 -46
  151. package/src/mappings/CheckboxGroup.js +0 -26
  152. package/src/mappings/CheckboxRow.js +0 -61
  153. package/src/mappings/CircleImage.js +0 -25
  154. package/src/mappings/Container.js +0 -30
  155. package/src/mappings/CustomCode.js +0 -8
  156. package/src/mappings/DatePicker.js +0 -182
  157. package/src/mappings/DeckSwiper.js +0 -48
  158. package/src/mappings/DeckSwiperCard.js +0 -16
  159. package/src/mappings/Divider.js +0 -27
  160. package/src/mappings/FAB.js +0 -37
  161. package/src/mappings/Fetch.js +0 -13
  162. package/src/mappings/FieldSearchBarFull.js +0 -50
  163. package/src/mappings/FlashList.js +0 -113
  164. package/src/mappings/FlatList.js +0 -51
  165. package/src/mappings/HeaderLarge.js +0 -29
  166. package/src/mappings/HeaderMedium.js +0 -55
  167. package/src/mappings/HeaderOverline.js +0 -55
  168. package/src/mappings/Icon.js +0 -32
  169. package/src/mappings/IconButton.js +0 -33
  170. package/src/mappings/Image.js +0 -35
  171. package/src/mappings/ImageBackground.js +0 -29
  172. package/src/mappings/KeyboardAvoidingView.js +0 -41
  173. package/src/mappings/KeyboardAwareScrollView.js +0 -50
  174. package/src/mappings/Layout.js +0 -200
  175. package/src/mappings/LinearGradient.js +0 -82
  176. package/src/mappings/MapCallout.js +0 -22
  177. package/src/mappings/MapMarker.js +0 -48
  178. package/src/mappings/MapView.js +0 -142
  179. package/src/mappings/Markdown.js +0 -25
  180. package/src/mappings/Modal.js +0 -42
  181. package/src/mappings/NumberInput.js +0 -254
  182. package/src/mappings/Picker.js +0 -153
  183. package/src/mappings/ProgressBar.js +0 -101
  184. package/src/mappings/ProgressCircle.js +0 -109
  185. package/src/mappings/ProgressIndicator.js +0 -181
  186. package/src/mappings/RadioButton.js +0 -51
  187. package/src/mappings/RadioButtonGroup.js +0 -17
  188. package/src/mappings/RadioButtonRow.js +0 -42
  189. package/src/mappings/RowBodyIcon.js +0 -75
  190. package/src/mappings/RowHeadlineImageCaption.js +0 -167
  191. package/src/mappings/RowHeadlineImageIcon.js +0 -99
  192. package/src/mappings/SVG.js +0 -20
  193. package/src/mappings/SafeAreaView.js +0 -33
  194. package/src/mappings/ScrollView.js +0 -37
  195. package/src/mappings/Shadow.js +0 -95
  196. package/src/mappings/Slider.js +0 -60
  197. package/src/mappings/StarRating.js +0 -43
  198. package/src/mappings/Stepper.js +0 -32
  199. package/src/mappings/Surface.js +0 -14
  200. package/src/mappings/Swiper.js +0 -71
  201. package/src/mappings/SwiperItem.js +0 -9
  202. package/src/mappings/Switch.js +0 -81
  203. package/src/mappings/TabView.js +0 -75
  204. package/src/mappings/TabViewItem.js +0 -30
  205. package/src/mappings/Text.js +0 -251
  206. package/src/mappings/TextArea.js +0 -283
  207. package/src/mappings/TextField.js +0 -400
  208. package/src/mappings/TextInput.js +0 -402
  209. package/src/mappings/ToggleButton.js +0 -50
  210. package/src/mappings/Touchable.js +0 -67
  211. package/src/mappings/Video.js +0 -81
  212. package/src/mappings/View.js +0 -207
  213. package/src/mappings/WebView.js +0 -88
  214. package/src/styles/DarkTheme.js +0 -26
  215. package/src/styles/DefaultTheme.js +0 -111
  216. package/src/styles/fonts.js +0 -62
  217. package/src/styles/overlay.js +0 -60
  218. package/src/styles/shadow.js +0 -51
  219. package/src/theming.js +0 -3
  220. package/src/utilities.js +0 -102
@@ -1 +0,0 @@
1
- export { default as BottomSheet } from "./BottomSheet";
@@ -1 +0,0 @@
1
- export { default as BottomSheet } from "./BottomSheet";
@@ -1,114 +0,0 @@
1
- import * as React from "react";
2
- import { Text, Pressable, Platform, StyleSheet, ActivityIndicator, } from "react-native";
3
- import { withTheme } from "../theming";
4
- const CONSTANTS = {
5
- baseHeight: 42,
6
- borderRadius: 4,
7
- padding: 8,
8
- icon: 24,
9
- };
10
- function Base({ Icon, icon, title, loading, disabled, style, activeOpacity = 0.8, disabledOpacity = 0.8, ...props }) {
11
- const { color, fontFamily, fontWeight, fontSize, lineHeight, letterSpacing, textTransform, textAlign, textDecorationLine, textDecorationColor, textDecorationStyle, ...buttonStyles } = StyleSheet.flatten(style || {});
12
- const titleStyles = {
13
- color,
14
- fontFamily,
15
- fontWeight,
16
- fontSize,
17
- lineHeight,
18
- letterSpacing,
19
- textTransform,
20
- textAlign,
21
- textDecorationLine,
22
- textDecorationColor,
23
- textDecorationStyle,
24
- };
25
- if (textAlign === "left") {
26
- buttonStyles.justifyContent = "flex-start";
27
- }
28
- if (textAlign === "right") {
29
- buttonStyles.justifyContent = "flex-end";
30
- }
31
- return (React.createElement(Pressable, { disabled: disabled || loading, style: ({ pressed }) => {
32
- return [
33
- styles.base,
34
- {
35
- opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
36
- },
37
- buttonStyles,
38
- ];
39
- }, ...props },
40
- loading ? (React.createElement(ActivityIndicator, { size: "small", color: color, style: styles.loading })) : null,
41
- icon && !loading ? (React.createElement(Icon, { name: icon, color: color, style: styles.icon, size: CONSTANTS.icon })) : null,
42
- React.createElement(Text, { style: titleStyles }, title)));
43
- }
44
- const Solid = ({ style, theme, ...props }) => {
45
- return (React.createElement(Base, { style: [
46
- {
47
- color: "#FFF",
48
- borderRadius: theme.roundness,
49
- backgroundColor: theme.colors.primary,
50
- },
51
- style,
52
- ], ...props }));
53
- };
54
- const ButtonSolid = withTheme(Solid);
55
- export { ButtonSolid };
56
- const Button = withTheme(Solid);
57
- export { Button };
58
- const Outline = ({ style, theme, ...props }) => {
59
- return (React.createElement(Base, { style: [
60
- styles.outline,
61
- {
62
- borderRadius: theme.roundness,
63
- borderColor: theme.colors.primary,
64
- color: theme.colors.primary,
65
- },
66
- style,
67
- ], ...props }));
68
- };
69
- const ButtonOutline = withTheme(Outline);
70
- export { ButtonOutline };
71
- const styles = StyleSheet.create({
72
- base: {
73
- position: "relative",
74
- flexDirection: "row",
75
- alignItems: "center",
76
- justifyContent: "center",
77
- minHeight: CONSTANTS.baseHeight,
78
- paddingHorizontal: 12,
79
- fontFamily: "System",
80
- fontWeight: "700",
81
- ...Platform.select({
82
- web: {
83
- cursor: "pointer",
84
- userSelect: "none",
85
- },
86
- }),
87
- },
88
- outline: {
89
- backgroundColor: "transparent",
90
- borderWidth: 1,
91
- },
92
- bare: {
93
- backgroundColor: "transparent",
94
- padding: 0,
95
- minHeight: undefined,
96
- },
97
- loading: {
98
- marginRight: 6,
99
- },
100
- icon: {
101
- ...Platform.select({
102
- web: {
103
- marginTop: 1,
104
- marginRight: 4,
105
- alignSelf: "center",
106
- },
107
- default: {
108
- marginBottom: 2,
109
- marginRight: 4,
110
- alignSelf: "center",
111
- },
112
- }),
113
- },
114
- });
@@ -1,57 +0,0 @@
1
- import React from "react";
2
- import { StyleSheet, View, Pressable, } from "react-native";
3
- import Image from "./Image";
4
- import Surface from "./Surface";
5
- import { Title, Subtitle, Caption } from "./Typography";
6
- import { withTheme } from "../theming";
7
- import Config from "./Config";
8
- const ICON_SIZE = Config.cardIconSize;
9
- const ICON_CONTAINER_SIZE = Config.cardIconSize * 2;
10
- const ICON_CONTAINER_PADDING = Config.cardIconSize / 2 - 1;
11
- const ICON_ELEVATION = Config.cardIconElevation;
12
- export const TopRightCircleIcon = withTheme(({ Icon, icon, theme, onPress, }) => {
13
- return (React.createElement(Surface, { style: {
14
- justifyContent: "center",
15
- alignItems: "center",
16
- elevation: ICON_ELEVATION,
17
- position: "absolute",
18
- top: 12,
19
- right: 12,
20
- width: ICON_CONTAINER_SIZE,
21
- height: ICON_CONTAINER_SIZE,
22
- padding: ICON_CONTAINER_PADDING,
23
- borderRadius: ICON_CONTAINER_SIZE,
24
- backgroundColor: "rgba(0, 0, 0, 0.1)",
25
- } },
26
- React.createElement(Pressable, { disabled: !onPress, onPress: onPress, style: ({ pressed }) => {
27
- return [
28
- {
29
- opacity: pressed ? 0.8 : 1,
30
- },
31
- ];
32
- } },
33
- React.createElement(Icon, { name: icon, size: ICON_SIZE, color: theme.colors.surface }))));
34
- });
35
- const Card = ({ Icon, image = Config.cardImageUrl, title, subtitle, description, textCentered, icon, aspectRatio = 1.5, elevation = 2, style, onPress, onPressIcon, titleStyle, subtitleStyle, descriptionStyle, theme, children, }) => {
36
- const { backgroundColor: bgColor, padding, ...styles } = StyleSheet.flatten(style || {});
37
- const backgroundColor = bgColor ? bgColor : theme.colors.surface;
38
- const innerPadding = padding ? padding : 12;
39
- return (React.createElement(Surface, { style: [{ elevation, backgroundColor }, styles] },
40
- React.createElement(Pressable, { disabled: !onPress, onPress: onPress, style: ({ pressed }) => {
41
- return [
42
- {
43
- opacity: pressed ? 0.8 : 1,
44
- },
45
- ];
46
- } },
47
- React.createElement(Image, { style: { aspectRatio }, source: typeof image === "string" ? { uri: image } : image, resizeMode: "cover" }),
48
- React.createElement(View, { style: { padding: innerPadding } },
49
- React.createElement(View, { style: { alignItems: textCentered ? "center" : "flex-start" } },
50
- title || (title && title !== "") ? (React.createElement(Title, { text: title, style: titleStyle })) : null,
51
- subtitle || (subtitle && subtitle !== "") ? (React.createElement(Subtitle, { text: subtitle, style: subtitleStyle })) : null,
52
- description || (description && description !== "") ? (React.createElement(View, { style: { marginTop: 4 } },
53
- React.createElement(Caption, { text: description, style: descriptionStyle }))) : null,
54
- children)),
55
- icon ? (React.createElement(TopRightCircleIcon, { Icon: Icon, icon: icon, onPress: onPressIcon })) : null)));
56
- };
57
- export default withTheme(Card);
@@ -1,62 +0,0 @@
1
- import * as React from "react";
2
- import { View, StyleSheet, Pressable, } from "react-native";
3
- import { useTheme } from "../../theming";
4
- import { usePrevious } from "../../hooks";
5
- const Checkbox = ({ Icon, status, disabled = false, onPress, onCheck, onUncheck, color, uncheckedColor, defaultValue, checkedIcon = "MaterialCommunityIcons/checkbox-marked", uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline", size = 24, style, ...rest }) => {
6
- const [internalValue, setInternalValue] = React.useState(status || defaultValue || false);
7
- React.useEffect(() => {
8
- if (status != null) {
9
- setInternalValue(status);
10
- }
11
- }, [status]);
12
- // This special logic is to handle weird APIs like Airtable that return
13
- // true or undefined for a boolean
14
- const previousDefaultValue = usePrevious(defaultValue);
15
- React.useEffect(() => {
16
- if (defaultValue !== previousDefaultValue) {
17
- setInternalValue(Boolean(defaultValue));
18
- }
19
- }, [defaultValue, previousDefaultValue]);
20
- const { colors } = useTheme();
21
- const checkboxColor = internalValue
22
- ? color || colors.primary
23
- : uncheckedColor || colors.primary;
24
- const handlePress = () => {
25
- const newValue = !internalValue;
26
- setInternalValue(newValue);
27
- onPress === null || onPress === void 0 ? void 0 : onPress(newValue);
28
- if (newValue) {
29
- onCheck === null || onCheck === void 0 ? void 0 : onCheck();
30
- }
31
- if (!newValue) {
32
- onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
33
- }
34
- };
35
- return (React.createElement(Pressable, { ...rest, onPress: handlePress, disabled: disabled, accessibilityState: { disabled }, accessibilityRole: "button", accessibilityLiveRegion: "polite", style: [styles.container, style, { width: size, height: size }] },
36
- React.createElement(Icon, { style: styles.icon, name: internalValue ? checkedIcon : uncheckedIcon, size: size, color: checkboxColor }),
37
- React.createElement(View, { style: [StyleSheet.absoluteFill, styles.fillContainer] },
38
- React.createElement(View, { style: [
39
- styles.fill,
40
- { opacity: disabled ? 0.5 : 1 },
41
- { borderColor: checkboxColor },
42
- ] }))));
43
- };
44
- const styles = StyleSheet.create({
45
- container: {
46
- borderRadius: 18,
47
- },
48
- fillContainer: {
49
- alignItems: "center",
50
- justifyContent: "center",
51
- },
52
- icon: {
53
- alignSelf: "center",
54
- },
55
- fill: {
56
- borderRadius: 5,
57
- width: 30,
58
- height: 30,
59
- alignSelf: "center",
60
- },
61
- });
62
- export default Checkbox;
@@ -1,21 +0,0 @@
1
- import * as React from "react";
2
- import { View } from "react-native";
3
- import { checkboxGroupContext, Direction } from "./context";
4
- const { Provider } = checkboxGroupContext;
5
- const CheckboxGroup = ({ direction = Direction.Vertical, values, onValueChange = () => { }, style, children, ...rest }) => {
6
- const _containerStyle = [
7
- {
8
- flexDirection: direction === Direction.Horizontal ? "row" : "column",
9
- overflow: "hidden",
10
- },
11
- ];
12
- if (direction !== Direction.Vertical) {
13
- _containerStyle.push({
14
- alignItems: "center",
15
- });
16
- }
17
- return (React.createElement(View, { style: [{ minHeight: 40 }, style], ...rest },
18
- React.createElement(Provider, { value: { values, onValueChange, direction } },
19
- React.createElement(View, { style: _containerStyle }, children))));
20
- };
21
- export default CheckboxGroup;
@@ -1,76 +0,0 @@
1
- import * as React from "react";
2
- import { StyleSheet, View, Platform, Pressable, } from "react-native";
3
- import Checkbox from "./Checkbox";
4
- import Text from "../Text";
5
- import { useCheckboxGroupContext } from "./context";
6
- import { Direction as GroupDirection } from "./context";
7
- import { extractStyles } from "../../utilities";
8
- export var Direction;
9
- (function (Direction) {
10
- Direction["Row"] = "row";
11
- Direction["RowReverse"] = "row-reverse";
12
- })(Direction || (Direction = {}));
13
- const getCheckboxAlignment = (parentDirection, direction) => {
14
- if (parentDirection === GroupDirection.Horizontal) {
15
- return direction === Direction.Row ? "flex-start" : "flex-end";
16
- }
17
- else if (direction === Direction.RowReverse) {
18
- return "flex-start";
19
- }
20
- else {
21
- return "flex-end";
22
- }
23
- };
24
- const renderLabel = (value, labelStyle, textStyle) => {
25
- if (typeof value === "string") {
26
- return React.createElement(Text, { style: [labelStyle, textStyle] }, value);
27
- }
28
- else {
29
- return React.createElement(React.Fragment, null, value);
30
- }
31
- };
32
- const CheckboxGroupRow = ({ Icon, label = "Label", status, value, onPress, labelContainerStyle, labelStyle, checkboxStyle, direction = Direction.Row, disabled, style, color, uncheckedColor, ...rest }) => {
33
- const { values: selectedValues, onValueChange, direction: parentDirection, } = useCheckboxGroupContext();
34
- const values = Array.isArray(selectedValues) ? selectedValues : [];
35
- const isChecked = status || values.includes(value);
36
- const handlePress = () => {
37
- if (!disabled) {
38
- onPress === null || onPress === void 0 ? void 0 : onPress(!isChecked);
39
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(value, !isChecked);
40
- }
41
- };
42
- const { textStyles, viewStyles } = extractStyles(style);
43
- return (React.createElement(Pressable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
44
- React.createElement(View, { style: [
45
- styles.label,
46
- {
47
- alignItems: direction === Direction.Row ? "flex-start" : "flex-end",
48
- },
49
- labelContainerStyle,
50
- ] }, renderLabel(label, labelStyle, textStyles)),
51
- React.createElement(View, { style: {
52
- flex: 1,
53
- alignItems: getCheckboxAlignment(parentDirection, direction),
54
- } },
55
- React.createElement(Checkbox, { Icon: Icon, status: isChecked, onPress: handlePress, style: checkboxStyle, disabled: disabled, color: color, uncheckedColor: uncheckedColor }))));
56
- };
57
- const styles = StyleSheet.create({
58
- mainParent: {
59
- alignItems: "center",
60
- justifyContent: "space-around",
61
- paddingStart: 20,
62
- minHeight: 50,
63
- paddingEnd: 20,
64
- display: "flex",
65
- ...Platform.select({
66
- web: {
67
- cursor: "pointer",
68
- userSelect: "none",
69
- },
70
- }),
71
- },
72
- label: {
73
- flex: 3,
74
- },
75
- });
76
- export default CheckboxGroupRow;
@@ -1,77 +0,0 @@
1
- import * as React from "react";
2
- import { StyleSheet, View, Platform, Pressable, } from "react-native";
3
- import { isString } from "lodash";
4
- import { extractStyles } from "../../utilities";
5
- import { usePrevious } from "../../hooks";
6
- import Text from "../Text";
7
- import Checkbox from "./Checkbox";
8
- export var Direction;
9
- (function (Direction) {
10
- Direction["Row"] = "row";
11
- Direction["RowReverse"] = "row-reverse";
12
- })(Direction || (Direction = {}));
13
- const renderLabel = (value, labelStyle, textStyle) => {
14
- if (isString(value)) {
15
- return React.createElement(Text, { style: [textStyle, labelStyle] }, value);
16
- }
17
- else {
18
- return React.createElement(React.Fragment, null, value);
19
- }
20
- };
21
- const CheckboxRow = ({ label = "Label", labelStyle, labelContainerStyle, checkboxStyle, direction = Direction.Row, Icon, status, disabled = false, onPress, onCheck, onUncheck, color, uncheckedColor, defaultValue, checkedIcon, uncheckedIcon, size, style, ...rest }) => {
22
- const [internalValue, setInternalValue] = React.useState(status || defaultValue || false);
23
- React.useEffect(() => {
24
- if (status != null) {
25
- setInternalValue(status);
26
- }
27
- }, [status]);
28
- // This special logic is to handle weird APIs like Airtable that return
29
- // true or undefined for a boolean
30
- const previousDefaultValue = usePrevious(defaultValue);
31
- React.useEffect(() => {
32
- if (defaultValue !== previousDefaultValue) {
33
- setInternalValue(Boolean(defaultValue));
34
- }
35
- }, [defaultValue, previousDefaultValue]);
36
- const handlePress = () => {
37
- const newValue = !internalValue;
38
- setInternalValue(newValue);
39
- onPress === null || onPress === void 0 ? void 0 : onPress(newValue);
40
- if (newValue) {
41
- onCheck === null || onCheck === void 0 ? void 0 : onCheck();
42
- }
43
- if (!newValue) {
44
- onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
45
- }
46
- };
47
- const { textStyles, viewStyles } = extractStyles(style);
48
- return (React.createElement(Pressable, { onPress: handlePress, style: [viewStyles, styles.mainParent, { flexDirection: direction }], disabled: disabled, ...rest },
49
- React.createElement(View, { style: [
50
- styles.label,
51
- {
52
- alignItems: direction === Direction.Row ? "flex-start" : "flex-end",
53
- },
54
- labelContainerStyle,
55
- ] }, renderLabel(label, textStyles, labelStyle)),
56
- React.createElement(Checkbox, { Icon: Icon, status: internalValue, style: checkboxStyle, disabled: disabled, onPress: handlePress, color: color, uncheckedColor: uncheckedColor, checkedIcon: checkedIcon, uncheckedIcon: uncheckedIcon, size: size })));
57
- };
58
- const styles = StyleSheet.create({
59
- mainParent: {
60
- alignItems: "center",
61
- justifyContent: "space-around",
62
- paddingStart: 20,
63
- minHeight: 50,
64
- paddingEnd: 20,
65
- display: "flex",
66
- ...Platform.select({
67
- web: {
68
- cursor: "pointer",
69
- userSelect: "none",
70
- },
71
- }),
72
- },
73
- label: {
74
- flex: 3,
75
- },
76
- });
77
- export default CheckboxRow;
@@ -1,14 +0,0 @@
1
- import { createContext, useContext } from "react";
2
- export var Direction;
3
- (function (Direction) {
4
- Direction["Horizontal"] = "horizontal";
5
- Direction["Vertical"] = "vertical";
6
- })(Direction || (Direction = {}));
7
- export const checkboxGroupContext = createContext({
8
- onValueChange: () => { },
9
- values: [],
10
- direction: undefined,
11
- });
12
- export function useCheckboxGroupContext() {
13
- return useContext(checkboxGroupContext);
14
- }
@@ -1,3 +0,0 @@
1
- export { default as Checkbox } from "./Checkbox";
2
- export { default as CheckboxGroup } from "./CheckboxGroup";
3
- export { default as CheckboxRow } from "./CheckboxRow";
@@ -1,8 +0,0 @@
1
- import * as React from "react";
2
- import { Image, } from "react-native";
3
- import Config from "./Config";
4
- const CircleImage = ({ source = Config.placeholderImageURL, size = 60, style, ...props }) => {
5
- const borderRadius = size / 2;
6
- return (React.createElement(Image, { style: [{ width: size, height: size, borderRadius }, style], source: typeof source === "string" ? { uri: source } : source, resizeMode: "cover", ...props }));
7
- };
8
- export default CircleImage;
@@ -1,81 +0,0 @@
1
- import React from "react";
2
- import { View } from "react-native";
3
- import { Svg, Path, G } from "react-native-svg";
4
- class CircularProgress extends React.Component {
5
- constructor() {
6
- super(...arguments);
7
- this.polarToCartesian = (centerX, centerY, radius, angleInDegrees) => {
8
- var angleInRadians = ((angleInDegrees - 90) * Math.PI) / 180.0;
9
- return {
10
- x: centerX + radius * Math.cos(angleInRadians),
11
- y: centerY + radius * Math.sin(angleInRadians),
12
- };
13
- };
14
- this.circlePath = (x, y, radius, startAngle, endAngle) => {
15
- var start = this.polarToCartesian(x, y, radius, endAngle * 0.9999);
16
- var end = this.polarToCartesian(x, y, radius, startAngle);
17
- var largeArcFlag = endAngle - startAngle <= 180 ? "0" : "1";
18
- var d = [
19
- "M",
20
- start.x,
21
- start.y,
22
- "A",
23
- radius,
24
- radius,
25
- 0,
26
- largeArcFlag,
27
- 0,
28
- end.x,
29
- end.y,
30
- ];
31
- return d.join(" ");
32
- };
33
- this.clampFill = (fill) => Math.min(100, Math.max(0, fill));
34
- }
35
- render() {
36
- const { size, width, backgroundWidth, tintColor = "black", tintTransparency = true, backgroundColor, style, rotation = 90, lineCap = "butt", arcSweepAngle = 360, fill, children, childrenContainerStyle, padding = 0, renderCap, dashedBackground = { width: 0, gap: 0 }, dashedTint = { width: 0, gap: 0 }, } = this.props;
37
- const maxWidthCircle = backgroundWidth
38
- ? Math.max(width, backgroundWidth)
39
- : width;
40
- const sizeWithPadding = size / 2 + padding / 2;
41
- const radius = size / 2 - maxWidthCircle / 2 - padding / 2;
42
- const currentFillAngle = (arcSweepAngle * this.clampFill(fill)) / 100;
43
- const backgroundPath = this.circlePath(sizeWithPadding, sizeWithPadding, radius, tintTransparency ? 0 : currentFillAngle, arcSweepAngle);
44
- const circlePathItem = this.circlePath(sizeWithPadding, sizeWithPadding, radius, 0, currentFillAngle);
45
- const coordinate = this.polarToCartesian(sizeWithPadding, sizeWithPadding, radius, currentFillAngle);
46
- const cap = renderCap ? renderCap({ center: coordinate }) : null;
47
- const offset = size - maxWidthCircle * 2;
48
- const localChildrenContainerStyle = [
49
- {
50
- position: "absolute",
51
- left: maxWidthCircle + padding / 2,
52
- top: maxWidthCircle + padding / 2,
53
- width: offset,
54
- height: offset,
55
- borderRadius: offset / 2,
56
- alignItems: "center",
57
- justifyContent: "center",
58
- overflow: "hidden",
59
- },
60
- childrenContainerStyle,
61
- ];
62
- const strokeDasharrayTint = dashedTint.gap > 0
63
- ? Object.values(dashedTint)
64
- .map((value) => value.toString())
65
- .join(" ")
66
- : "";
67
- const strokeDasharrayBackground = dashedBackground.gap > 0
68
- ? Object.values(dashedBackground)
69
- .map((value) => value.toString())
70
- .join(" ")
71
- : "";
72
- return (React.createElement(View, { style: style },
73
- React.createElement(Svg, { width: size + padding, height: size + padding },
74
- React.createElement(G, { rotation: rotation, originX: (size + padding) / 2, originY: (size + padding) / 2 },
75
- backgroundColor && (React.createElement(Path, { d: backgroundPath, stroke: backgroundColor, strokeWidth: backgroundWidth || width, strokeLinecap: lineCap, strokeDasharray: strokeDasharrayBackground, fill: "transparent" })),
76
- fill > 0 && (React.createElement(Path, { d: circlePathItem, stroke: tintColor, strokeWidth: width, strokeLinecap: lineCap, strokeDasharray: strokeDasharrayTint, fill: "transparent" })),
77
- cap)),
78
- children && (React.createElement(View, { style: localChildrenContainerStyle }, children(fill)))));
79
- }
80
- }
81
- export default CircularProgress;
@@ -1,64 +0,0 @@
1
- import { Dimensions, Platform } from "react-native";
2
- const getWindowDimensions = () => {
3
- const { width, height } = Dimensions.get("window");
4
- return {
5
- windowWidth: width,
6
- windowHeight: height,
7
- };
8
- };
9
- const { windowWidth, windowHeight } = getWindowDimensions();
10
- const getFilters = (options) => {
11
- const { width, height } = options;
12
- const filters = ["c_scale", "q_auto", "dpr_auto"];
13
- if (width)
14
- filters.push(`w_${width}`);
15
- if (height)
16
- filters.push(`h_${height}`);
17
- return filters.join(",");
18
- };
19
- const buildImageUrl = (options, name) => {
20
- const filters = getFilters(options);
21
- return [
22
- "https://res.cloudinary.com/altos/image/upload",
23
- filters,
24
- `${name}.png`,
25
- ].join("/");
26
- };
27
- const getExtension = () => {
28
- return Platform.OS === "web" ? ".svg" : ".png";
29
- };
30
- export default {
31
- windowWidth,
32
- windowHeight,
33
- avatarImageUrl: buildImageUrl({
34
- width: 60,
35
- height: 60,
36
- }, "Avatar"),
37
- avatarImageSize: 60,
38
- cardImageSize: 200,
39
- cardImageUrl: "https://static.draftbit.com/images/placeholder-image" + getExtension(),
40
- cardIconSize: 16,
41
- cardIconBackgroundOpacity: 0.24,
42
- cardIconElevation: 1,
43
- placeholderImageURL: "https://static.draftbit.com/images/placeholder-image" + getExtension(),
44
- getPlaceholderImageUrl: (size) => buildImageUrl({ width: size.width, height: size.height }, "image-placeholder_1"),
45
- placeholderSvgURL: "https://static.draftbit.com/images/placeholder-image.svg",
46
- squareImageUrl: buildImageUrl({ width: 100, height: 100 }, "Avatar"),
47
- FABSize: 40,
48
- FABBorderRadius: 20,
49
- FABFixedHeight: 64,
50
- cardContainerShortImageAspectRatio: 1,
51
- rowSingleLineImageSize: 24,
52
- rowMultiLineImageSize: 48,
53
- rowSingleLineIconSize: 24,
54
- rowMultiLineIconSize: 16,
55
- headerIconSize: 24,
56
- buttonIconSize: 24,
57
- swiperInactiveDotSize: 6,
58
- swiperActiveDotSize: 10,
59
- fieldSearchBarFullIconSize: 24,
60
- stepperButtonSize: 40,
61
- radioButtonSize: 24,
62
- topSafeAreaViewHeight: 0,
63
- // topSafeAreaViewHeight: Platform.OS === "android" ? Constants.statusBarHeight : 0
64
- };
@@ -1,43 +0,0 @@
1
- import * as React from "react";
2
- import { View, ImageBackground, StyleSheet, } from "react-native";
3
- import { withTheme } from "../theming";
4
- import Elevation from "./Elevation";
5
- const Container = ({ useThemeGutterPadding, borderColor, borderWidth, backgroundColor, backgroundImage, backgroundImageResizeMode, elevation, style, children, theme, // eslint-disable-line @typescript-eslint/no-unused-vars
6
- ...rest }) => {
7
- const { flex, flexGrow, flexWrap, flexBasis, flexShrink, flexDirection, alignContent, justifyContent, alignItems, padding, paddingTop, paddingBottom, paddingLeft, paddingRight, paddingVertical, paddingHorizontal, ...styleProp } = StyleSheet.flatten(style) || {};
8
- const containerStyle = {
9
- backgroundColor,
10
- borderColor,
11
- borderWidth,
12
- width: "100%",
13
- ...styleProp,
14
- };
15
- const innerStyle = {
16
- flex,
17
- flexGrow,
18
- flexWrap,
19
- flexBasis,
20
- flexShrink,
21
- flexDirection,
22
- alignContent,
23
- justifyContent,
24
- alignItems,
25
- padding,
26
- paddingTop,
27
- paddingBottom,
28
- paddingLeft,
29
- paddingRight,
30
- paddingVertical,
31
- paddingHorizontal: paddingHorizontal || useThemeGutterPadding ? 16 : 0,
32
- };
33
- const Wrap = elevation ? Elevation : View;
34
- if (elevation)
35
- containerStyle.elevation = elevation;
36
- return (React.createElement(Wrap, { style: [containerStyle, style], ...rest }, backgroundImage ? (React.createElement(ImageBackground, { source: typeof backgroundImage === "string"
37
- ? { uri: backgroundImage }
38
- : backgroundImage, resizeMode: backgroundImageResizeMode, style: {
39
- flex: 1,
40
- } },
41
- React.createElement(View, { style: innerStyle }, children))) : (React.createElement(View, { style: innerStyle }, children))));
42
- };
43
- export default withTheme(Container);