@draftbit/core 47.0.1-ed6e56.2 → 47.1.0

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 (277) hide show
  1. package/lib/commonjs/components/Button.js +3 -3
  2. package/lib/commonjs/components/Checkbox/Checkbox.js +1 -3
  3. package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +1 -2
  4. package/lib/commonjs/components/Checkbox/CheckboxRow.js +1 -2
  5. package/lib/commonjs/components/DatePicker/DatePicker.js +0 -1
  6. package/lib/commonjs/components/DatePicker/DatePickerComponent.js +9 -3
  7. package/lib/commonjs/components/DatePicker/DatePickerComponent.web.js +1 -0
  8. package/lib/commonjs/components/DeprecatedButton.js +3 -27
  9. package/lib/commonjs/components/DeprecatedFAB.js +1 -2
  10. package/lib/commonjs/components/Justification.js +1 -5
  11. package/lib/commonjs/components/Pressable.js +37 -0
  12. package/lib/commonjs/components/ResizeMode.js +1 -5
  13. package/lib/commonjs/components/Swiper/Swiper.js +2 -0
  14. package/lib/commonjs/components/Touchable.js +8 -3
  15. package/lib/commonjs/index.js +7 -0
  16. package/lib/commonjs/mappings/Button.js +39 -10
  17. package/lib/commonjs/mappings/FlashList.js +45 -2
  18. package/lib/commonjs/mappings/FlatList.js +12 -0
  19. package/lib/commonjs/mappings/Swiper.js +2 -0
  20. package/lib/commonjs/mappings/Touchable.js +47 -7
  21. package/lib/module/components/Button.js +3 -3
  22. package/lib/module/components/Checkbox/Checkbox.js +2 -3
  23. package/lib/module/components/Checkbox/CheckboxGroupRow.js +2 -3
  24. package/lib/module/components/Checkbox/CheckboxRow.js +2 -3
  25. package/lib/module/components/DatePicker/DatePicker.js +0 -1
  26. package/lib/module/components/DatePicker/DatePickerComponent.js +9 -3
  27. package/lib/module/components/DatePicker/DatePickerComponent.web.js +1 -0
  28. package/lib/module/components/DeprecatedButton.js +4 -28
  29. package/lib/module/components/DeprecatedFAB.js +2 -3
  30. package/lib/module/components/Justification.js +0 -1
  31. package/lib/module/components/Pressable.js +30 -0
  32. package/lib/module/components/ResizeMode.js +0 -1
  33. package/lib/module/components/Swiper/Swiper.js +2 -0
  34. package/lib/module/components/Touchable.js +8 -3
  35. package/lib/module/index.js +1 -0
  36. package/lib/module/mappings/Button.js +40 -11
  37. package/lib/module/mappings/FlashList.js +46 -3
  38. package/lib/module/mappings/FlatList.js +13 -1
  39. package/lib/module/mappings/Swiper.js +3 -1
  40. package/lib/module/mappings/Touchable.js +49 -9
  41. package/lib/typescript/src/components/Button.d.ts.map +1 -1
  42. package/lib/typescript/src/components/Checkbox/Checkbox.d.ts +2 -2
  43. package/lib/typescript/src/components/Checkbox/Checkbox.d.ts.map +1 -1
  44. package/lib/typescript/src/components/Checkbox/CheckboxGroupRow.d.ts.map +1 -1
  45. package/lib/typescript/src/components/Checkbox/CheckboxRow.d.ts.map +1 -1
  46. package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map +1 -1
  47. package/lib/typescript/src/components/DatePicker/DatePickerComponent.d.ts.map +1 -1
  48. package/lib/typescript/src/components/DatePicker/DatePickerComponent.web.d.ts.map +1 -1
  49. package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts +0 -2
  50. package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts.map +1 -1
  51. package/lib/typescript/src/components/DeprecatedButton.d.ts +2 -2
  52. package/lib/typescript/src/components/DeprecatedButton.d.ts.map +1 -1
  53. package/lib/typescript/src/components/DeprecatedFAB.d.ts +2 -2
  54. package/lib/typescript/src/components/DeprecatedFAB.d.ts.map +1 -1
  55. package/lib/typescript/src/components/Pressable.d.ts +10 -0
  56. package/lib/typescript/src/components/Pressable.d.ts.map +1 -0
  57. package/lib/typescript/src/components/Swiper/Swiper.d.ts +2 -1
  58. package/lib/typescript/src/components/Swiper/Swiper.d.ts.map +1 -1
  59. package/lib/typescript/src/components/Touchable.d.ts +5 -6
  60. package/lib/typescript/src/components/Touchable.d.ts.map +1 -1
  61. package/lib/typescript/src/index.d.ts +1 -0
  62. package/lib/typescript/src/index.d.ts.map +1 -1
  63. package/lib/typescript/src/mappings/Button.d.ts +113 -4
  64. package/lib/typescript/src/mappings/Button.d.ts.map +1 -1
  65. package/lib/typescript/src/mappings/FlashList.d.ts +112 -2
  66. package/lib/typescript/src/mappings/FlashList.d.ts.map +1 -1
  67. package/lib/typescript/src/mappings/FlatList.d.ts +42 -0
  68. package/lib/typescript/src/mappings/FlatList.d.ts.map +1 -1
  69. package/lib/typescript/src/mappings/Swiper.d.ts +11 -0
  70. package/lib/typescript/src/mappings/Swiper.d.ts.map +1 -1
  71. package/lib/typescript/src/mappings/Touchable.d.ts +59 -5
  72. package/lib/typescript/src/mappings/Touchable.d.ts.map +1 -1
  73. package/package.json +6 -6
  74. package/src/components/Button.tsx +14 -4
  75. package/src/components/Checkbox/Checkbox.tsx +5 -7
  76. package/src/components/Checkbox/CheckboxGroupRow.tsx +3 -3
  77. package/src/components/Checkbox/CheckboxRow.tsx +3 -3
  78. package/src/components/DatePicker/DatePicker.tsx +0 -1
  79. package/src/components/DatePicker/DatePickerComponent.tsx +11 -3
  80. package/src/components/DatePicker/DatePickerComponent.web.tsx +1 -0
  81. package/src/components/DatePicker/DatePickerComponentType.ts +0 -9
  82. package/src/components/DeprecatedButton.tsx +7 -31
  83. package/src/components/DeprecatedFAB.tsx +5 -5
  84. package/src/components/Pressable.tsx +44 -0
  85. package/src/components/Swiper/Swiper.tsx +3 -0
  86. package/src/components/Touchable.tsx +11 -7
  87. package/src/index.tsx +1 -0
  88. package/src/mappings/Button.ts +41 -10
  89. package/src/mappings/FlashList.ts +82 -30
  90. package/src/mappings/FlatList.ts +16 -0
  91. package/src/mappings/Swiper.ts +4 -0
  92. package/src/mappings/Touchable.ts +53 -6
  93. package/lib/commonjs/components/DatePicker/DatePickerInput.js +0 -133
  94. package/lib/module/components/DatePicker/DatePickerInput.js +0 -123
  95. package/lib/typescript/src/components/DatePicker/DatePickerInput.d.ts +0 -18
  96. package/lib/typescript/src/components/DatePicker/DatePickerInput.d.ts.map +0 -1
  97. package/src/Provider.js +0 -9
  98. package/src/components/Accordion/AccordionGroup.js +0 -44
  99. package/src/components/Accordion/AccordionItem.js +0 -32
  100. package/src/components/Accordion/index.js +0 -2
  101. package/src/components/ActionSheet/ActionSheet.js +0 -45
  102. package/src/components/ActionSheet/ActionSheetCancel.js +0 -6
  103. package/src/components/ActionSheet/ActionSheetItem.js +0 -30
  104. package/src/components/ActionSheet/index.js +0 -3
  105. package/src/components/AnimatedCircularProgress.js +0 -43
  106. package/src/components/AspectRatio.js +0 -18
  107. package/src/components/AvatarEdit.js +0 -30
  108. package/src/components/Banner.js +0 -109
  109. package/src/components/Button.js +0 -114
  110. package/src/components/Card.js +0 -57
  111. package/src/components/CardBlock.js +0 -54
  112. package/src/components/CardContainer.js +0 -69
  113. package/src/components/CardContainerRating.js +0 -79
  114. package/src/components/CardContainerShortImage.js +0 -33
  115. package/src/components/CardInline.js +0 -36
  116. package/src/components/Carousel.js +0 -68
  117. package/src/components/Checkbox/Checkbox.js +0 -63
  118. package/src/components/Checkbox/CheckboxGroup.js +0 -21
  119. package/src/components/Checkbox/CheckboxGroupRow.js +0 -77
  120. package/src/components/Checkbox/CheckboxRow.js +0 -78
  121. package/src/components/Checkbox/context.js +0 -14
  122. package/src/components/Checkbox/index.js +0 -3
  123. package/src/components/CircleImage.js +0 -8
  124. package/src/components/CircularProgress.js +0 -81
  125. package/src/components/Config.js +0 -64
  126. package/src/components/Container.js +0 -43
  127. package/src/components/DatePicker/DatePicker.js +0 -377
  128. package/src/components/DatePicker/DatePickerComponent.js +0 -11
  129. package/src/components/DatePicker/DatePickerComponent.web.js +0 -30
  130. package/src/components/DatePicker/DatePickerComponentType.js +0 -1
  131. package/src/components/DatePicker/DatePickerInput.js +0 -97
  132. package/src/components/DatePicker/DatePickerInput.tsx +0 -195
  133. package/src/components/DeprecatedButton.js +0 -95
  134. package/src/components/DeprecatedCardWrapper.js +0 -18
  135. package/src/components/DeprecatedFAB.js +0 -115
  136. package/src/components/Divider.js +0 -13
  137. package/src/components/Elevation.js +0 -20
  138. package/src/components/FAB.js +0 -46
  139. package/src/components/FieldSearchBarFull.js +0 -53
  140. package/src/components/FormRow.js +0 -19
  141. package/src/components/Header.js +0 -44
  142. package/src/components/HeaderLarge.js +0 -7
  143. package/src/components/HeaderMedium.js +0 -7
  144. package/src/components/HeaderOverline.js +0 -7
  145. package/src/components/IconButton.js +0 -35
  146. package/src/components/Image.js +0 -47
  147. package/src/components/Justification.js +0 -1
  148. package/src/components/Layout.js +0 -50
  149. package/src/components/NumberInput.js +0 -49
  150. package/src/components/Picker/Picker.js +0 -267
  151. package/src/components/Picker/PickerComponent.android.js +0 -69
  152. package/src/components/Picker/PickerComponent.ios.js +0 -79
  153. package/src/components/Picker/PickerComponent.web.js +0 -70
  154. package/src/components/Picker/PickerTypes.js +0 -1
  155. package/src/components/Portal/Portal.js +0 -35
  156. package/src/components/Portal/PortalConsumer.js +0 -27
  157. package/src/components/Portal/PortalHost.js +0 -107
  158. package/src/components/Portal/PortalManager.js +0 -32
  159. package/src/components/ProgressBar.js +0 -118
  160. package/src/components/ProgressCircle.js +0 -13
  161. package/src/components/ProgressIndicator.js +0 -27
  162. package/src/components/RadioButton/RadioButton.js +0 -17
  163. package/src/components/RadioButton/RadioButtonFieldGroup.js +0 -17
  164. package/src/components/RadioButton/RadioButtonGroup.js +0 -43
  165. package/src/components/RadioButton/RadioButtonRow.js +0 -76
  166. package/src/components/RadioButton/context.js +0 -14
  167. package/src/components/RadioButton/index.js +0 -4
  168. package/src/components/ResizeMode.js +0 -1
  169. package/src/components/Row.js +0 -48
  170. package/src/components/RowBodyIcon.js +0 -8
  171. package/src/components/RowHeadlineImageCaption.js +0 -12
  172. package/src/components/RowHeadlineImageIcon.js +0 -14
  173. package/src/components/SVG.js +0 -13
  174. package/src/components/ScreenContainer.js +0 -34
  175. package/src/components/Slider.js +0 -63
  176. package/src/components/StarRating.js +0 -50
  177. package/src/components/StepIndicator.js +0 -346
  178. package/src/components/Stepper.js +0 -41
  179. package/src/components/Surface.js +0 -32
  180. package/src/components/Swiper/Swiper.js +0 -29
  181. package/src/components/Swiper/SwiperItem.js +0 -9
  182. package/src/components/Swiper/index.js +0 -2
  183. package/src/components/Switch.js +0 -56
  184. package/src/components/Text.js +0 -33
  185. package/src/components/TextField.js +0 -428
  186. package/src/components/ToggleButton.js +0 -39
  187. package/src/components/Touchable.js +0 -12
  188. package/src/components/Touchable.web.js +0 -2
  189. package/src/components/Typography.js +0 -36
  190. package/src/components/useAuthState.js +0 -31
  191. package/src/constants.js +0 -10
  192. package/src/hooks.js +0 -12
  193. package/src/index.js +0 -52
  194. package/src/interfaces/Icon.js +0 -8
  195. package/src/mappings/Accordion.js +0 -41
  196. package/src/mappings/AccordionItem.js +0 -16
  197. package/src/mappings/ActionSheet.js +0 -13
  198. package/src/mappings/ActionSheetCancel.js +0 -19
  199. package/src/mappings/ActionSheetItem.js +0 -23
  200. package/src/mappings/ActivityIndicator.js +0 -58
  201. package/src/mappings/AudioPlayer.js +0 -57
  202. package/src/mappings/AvatarEdit.js +0 -38
  203. package/src/mappings/Banner.js +0 -32
  204. package/src/mappings/BlurView.js +0 -42
  205. package/src/mappings/Button.js +0 -87
  206. package/src/mappings/Card.js +0 -52
  207. package/src/mappings/CardBlock.js +0 -123
  208. package/src/mappings/CardContainer.js +0 -104
  209. package/src/mappings/CardContainerRating.js +0 -126
  210. package/src/mappings/CardContainerShortImage.js +0 -120
  211. package/src/mappings/CardInline.js +0 -52
  212. package/src/mappings/Carousel.js +0 -19
  213. package/src/mappings/Checkbox.js +0 -46
  214. package/src/mappings/CheckboxGroup.js +0 -26
  215. package/src/mappings/CheckboxRow.js +0 -61
  216. package/src/mappings/CircleImage.js +0 -25
  217. package/src/mappings/Container.js +0 -30
  218. package/src/mappings/CustomCode.js +0 -8
  219. package/src/mappings/DatePicker.js +0 -176
  220. package/src/mappings/Divider.js +0 -27
  221. package/src/mappings/FAB.js +0 -37
  222. package/src/mappings/Fetch.js +0 -13
  223. package/src/mappings/FieldSearchBarFull.js +0 -50
  224. package/src/mappings/FlashList.js +0 -33
  225. package/src/mappings/FlatList.js +0 -24
  226. package/src/mappings/HeaderLarge.js +0 -29
  227. package/src/mappings/HeaderMedium.js +0 -55
  228. package/src/mappings/HeaderOverline.js +0 -55
  229. package/src/mappings/Icon.js +0 -32
  230. package/src/mappings/IconButton.js +0 -35
  231. package/src/mappings/Image.js +0 -35
  232. package/src/mappings/ImageBackground.js +0 -29
  233. package/src/mappings/KeyboardAvoidingView.js +0 -41
  234. package/src/mappings/KeyboardAwareScrollView.js +0 -50
  235. package/src/mappings/Layout.js +0 -200
  236. package/src/mappings/LinearGradient.js +0 -77
  237. package/src/mappings/MapCallout.js +0 -21
  238. package/src/mappings/MapMarker.js +0 -47
  239. package/src/mappings/MapView.js +0 -139
  240. package/src/mappings/Modal.js +0 -42
  241. package/src/mappings/NumberInput.js +0 -254
  242. package/src/mappings/Picker.js +0 -148
  243. package/src/mappings/ProgressBar.js +0 -101
  244. package/src/mappings/ProgressCircle.js +0 -109
  245. package/src/mappings/ProgressIndicator.js +0 -181
  246. package/src/mappings/RadioButton.js +0 -51
  247. package/src/mappings/RadioButtonGroup.js +0 -17
  248. package/src/mappings/RadioButtonRow.js +0 -42
  249. package/src/mappings/RowBodyIcon.js +0 -75
  250. package/src/mappings/RowHeadlineImageCaption.js +0 -167
  251. package/src/mappings/RowHeadlineImageIcon.js +0 -99
  252. package/src/mappings/SVG.js +0 -20
  253. package/src/mappings/SafeAreaView.js +0 -33
  254. package/src/mappings/ScrollView.js +0 -31
  255. package/src/mappings/Slider.js +0 -60
  256. package/src/mappings/StarRating.js +0 -43
  257. package/src/mappings/Stepper.js +0 -32
  258. package/src/mappings/Surface.js +0 -14
  259. package/src/mappings/Swiper.js +0 -60
  260. package/src/mappings/SwiperItem.js +0 -8
  261. package/src/mappings/Switch.js +0 -81
  262. package/src/mappings/Text.js +0 -251
  263. package/src/mappings/TextArea.js +0 -274
  264. package/src/mappings/TextField.js +0 -391
  265. package/src/mappings/TextInput.js +0 -402
  266. package/src/mappings/ToggleButton.js +0 -50
  267. package/src/mappings/Touchable.js +0 -17
  268. package/src/mappings/Video.js +0 -81
  269. package/src/mappings/View.js +0 -207
  270. package/src/mappings/WebView.js +0 -88
  271. package/src/styles/DarkTheme.js +0 -26
  272. package/src/styles/DefaultTheme.js +0 -111
  273. package/src/styles/fonts.js +0 -62
  274. package/src/styles/overlay.js +0 -60
  275. package/src/styles/shadow.js +0 -51
  276. package/src/theming.js +0 -3
  277. package/src/utilities.js +0 -102
@@ -1,35 +0,0 @@
1
- import * as React from "react";
2
- import PortalConsumer from "./PortalConsumer";
3
- import PortalHost, { PortalContext } from "./PortalHost";
4
- import { ThemeProvider, withTheme } from "../../theming";
5
- /**
6
- * Portal allows to render a component at a different place in the parent tree.
7
- * You can use it to render content which should appear above other elements, similar to `Modal`.
8
- * It requires a [`Portal.Host`](portal-host.html) component to be rendered somewhere in the parent tree.
9
- *
10
- * ## Usage
11
- * ```js
12
- * import * as React from 'react';
13
- * import { Portal, Text } from 'react-native-paper';
14
- *
15
- * export default class MyComponent extends React.Component {
16
- * render() {
17
- * return (
18
- * <Portal>
19
- * <Text>This is rendered at a different place</Text>
20
- * </Portal>
21
- * );
22
- * }
23
- * }
24
- * ```
25
- */
26
- class Portal extends React.Component {
27
- render() {
28
- const { children, theme } = this.props;
29
- return (React.createElement(PortalContext.Consumer, null, (manager) => (React.createElement(PortalConsumer, { manager: manager },
30
- React.createElement(ThemeProvider, { theme: theme }, children)))));
31
- }
32
- }
33
- // @component ./PortalHost.tsx
34
- Portal.Host = PortalHost;
35
- export default withTheme(Portal);
@@ -1,27 +0,0 @@
1
- import * as React from "react";
2
- export default class PortalConsumer extends React.Component {
3
- async componentDidMount() {
4
- this.checkManager();
5
- // Delay updating to prevent React from going to infinite loop
6
- await Promise.resolve();
7
- this.key = this.props.manager.mount(this.props.children);
8
- }
9
- componentDidUpdate() {
10
- this.checkManager();
11
- this.props.manager.update(this.key, this.props.children);
12
- }
13
- componentWillUnmount() {
14
- this.checkManager();
15
- this.props.manager.unmount(this.key);
16
- }
17
- checkManager() {
18
- if (!this.props.manager) {
19
- throw new Error("Looks like you forgot to wrap your root component with `Provider` component from `react-native-paper`.\n\n" +
20
- "Please read our getting-started guide and make sure you've followed all the required steps.\n\n" +
21
- "https://callstack.github.io/react-native-paper/getting-started.html");
22
- }
23
- }
24
- render() {
25
- return null;
26
- }
27
- }
@@ -1,107 +0,0 @@
1
- import * as React from "react";
2
- import { View, StyleSheet } from "react-native";
3
- import PortalManager from "./PortalManager";
4
- export const PortalContext = React.createContext(null);
5
- /**
6
- * Portal host renders all of its children `Portal` elements.
7
- * For example, you can wrap a screen in `Portal.Host` to render items above the screen.
8
- * If you're using the `Provider` component, it already includes `Portal.Host`.
9
- *
10
- * ## Usage
11
- * ```js
12
- * import * as React from 'react';
13
- * import { Text } from 'react-native';
14
- * import { Portal } from 'react-native-paper';
15
- *
16
- * export default class MyComponent extends React.Component {
17
- * render() {
18
- * return (
19
- * <Portal.Host>
20
- * <Text>Content of the app</Text>
21
- * </Portal.Host>
22
- * );
23
- * }
24
- * }
25
- * ```
26
- *
27
- * Here any `Portal` elements under `<App />` are rendered alongside `<App />` and will appear above `<App />` like a `Modal`.
28
- */
29
- export default class PortalHost extends React.Component {
30
- constructor() {
31
- super(...arguments);
32
- this.setManager = (manager) => {
33
- this.manager = manager;
34
- };
35
- this.mount = (children) => {
36
- const key = this.nextKey++;
37
- if (this.manager) {
38
- this.manager.mount(key, children);
39
- }
40
- else {
41
- this.queue.push({ type: "mount", key, children });
42
- }
43
- return key;
44
- };
45
- this.update = (key, children) => {
46
- if (this.manager) {
47
- this.manager.update(key, children);
48
- }
49
- else {
50
- const op = { type: "mount", key, children };
51
- const index = this.queue.findIndex((o) => o.type === "mount" || (o.type === "update" && o.key === key));
52
- if (index > -1) {
53
- // @ts-ignore
54
- this.queue[index] = op;
55
- }
56
- else {
57
- this.queue.push(op);
58
- }
59
- }
60
- };
61
- this.unmount = (key) => {
62
- if (this.manager) {
63
- this.manager.unmount(key);
64
- }
65
- else {
66
- this.queue.push({ type: "unmount", key });
67
- }
68
- };
69
- this.nextKey = 0;
70
- this.queue = [];
71
- }
72
- componentDidMount() {
73
- const manager = this.manager;
74
- const queue = this.queue;
75
- while (queue.length && manager) {
76
- const action = queue.pop();
77
- if (action) {
78
- switch (action.type) {
79
- case "mount":
80
- manager.mount(action.key, action.children);
81
- break;
82
- case "update":
83
- manager.update(action.key, action.children);
84
- break;
85
- case "unmount":
86
- manager.unmount(action.key);
87
- break;
88
- }
89
- }
90
- }
91
- }
92
- render() {
93
- return (React.createElement(PortalContext.Provider, { value: {
94
- mount: this.mount,
95
- update: this.update,
96
- unmount: this.unmount,
97
- } },
98
- React.createElement(View, { style: styles.container, collapsable: false, pointerEvents: "box-none" }, this.props.children),
99
- React.createElement(PortalManager, { ref: this.setManager })));
100
- }
101
- }
102
- PortalHost.displayName = "Portal.Host";
103
- const styles = StyleSheet.create({
104
- container: {
105
- flex: 1,
106
- },
107
- });
@@ -1,32 +0,0 @@
1
- import * as React from "react";
2
- import { View, StyleSheet } from "react-native";
3
- /**
4
- * Portal host is the component which actually renders all Portals.
5
- */
6
- export default class PortalManager extends React.PureComponent {
7
- constructor() {
8
- super(...arguments);
9
- this.state = {
10
- portals: [],
11
- };
12
- this.mount = (key, children) => {
13
- this.setState((state) => ({
14
- portals: [...state.portals, { key, children }],
15
- }));
16
- };
17
- this.update = (key, children) => this.setState((state) => ({
18
- portals: state.portals.map((item) => {
19
- if (item.key === key) {
20
- return { ...item, children };
21
- }
22
- return item;
23
- }),
24
- }));
25
- this.unmount = (key) => this.setState((state) => ({
26
- portals: state.portals.filter((item) => item.key !== key),
27
- }));
28
- }
29
- render() {
30
- return this.state.portals.map(({ key, children }) => (React.createElement(View, { key: key, collapsable: false /* Need collapsable=false here to clip the elevations, otherwise they appear above sibling components */, pointerEvents: "box-none", style: StyleSheet.absoluteFill }, children)));
31
- }
32
- }
@@ -1,118 +0,0 @@
1
- import React, { Component } from "react";
2
- import { Animated, Easing, View, I18nManager, } from "react-native";
3
- const INDETERMINATE_WIDTH_FACTOR = 0.3;
4
- const BAR_WIDTH_ZERO_POSITION = INDETERMINATE_WIDTH_FACTOR / (1 + INDETERMINATE_WIDTH_FACTOR);
5
- export default class ProgressBar extends Component {
6
- constructor(props) {
7
- super(props);
8
- this.handleLayout = (event) => {
9
- const { width = 150, onLayout } = this.props;
10
- if (!width) {
11
- this.setState({ width: event.nativeEvent.layout.width });
12
- }
13
- if (onLayout) {
14
- onLayout(event);
15
- }
16
- };
17
- const { progress: progressP = 0, indeterminate = false } = props;
18
- const progress = Math.min(Math.max(progressP, 0), 1);
19
- this.state = {
20
- width: 0,
21
- progress: new Animated.Value(indeterminate ? INDETERMINATE_WIDTH_FACTOR : progress),
22
- animationValue: new Animated.Value(BAR_WIDTH_ZERO_POSITION),
23
- };
24
- }
25
- componentDidMount() {
26
- const { indeterminate = false } = this.props;
27
- if (indeterminate) {
28
- this.animate();
29
- }
30
- }
31
- componentDidUpdate(prevProps) {
32
- const { indeterminate = false, useNativeDriver = false, progress: progressP = 0, animationType = "spring", animationConfig = { bounciness: 0 }, animated = true, } = this.props;
33
- if (prevProps.indeterminate !== indeterminate) {
34
- if (indeterminate) {
35
- this.animate();
36
- }
37
- else {
38
- Animated.spring(this.state.animationValue, {
39
- toValue: BAR_WIDTH_ZERO_POSITION,
40
- useNativeDriver,
41
- }).start();
42
- }
43
- }
44
- if (prevProps.indeterminate !== indeterminate ||
45
- prevProps.progress !== progressP) {
46
- const progress = this.props.indeterminate
47
- ? INDETERMINATE_WIDTH_FACTOR
48
- : Math.min(Math.max(progressP, 0), 1);
49
- if (animated) {
50
- Animated[animationType](this.state.progress, {
51
- ...animationConfig,
52
- toValue: progress,
53
- velocity: 0,
54
- useNativeDriver,
55
- }).start();
56
- }
57
- else {
58
- this.state.progress.setValue(progress);
59
- }
60
- }
61
- }
62
- animate() {
63
- const { useNativeDriver = false, indeterminateAnimationDuration = 1000 } = this.props;
64
- this.state.animationValue.setValue(0);
65
- Animated.timing(this.state.animationValue, {
66
- toValue: 1,
67
- duration: indeterminateAnimationDuration,
68
- easing: Easing.linear,
69
- isInteraction: false,
70
- useNativeDriver,
71
- }).start((endState) => {
72
- if (endState.finished) {
73
- this.animate();
74
- }
75
- });
76
- }
77
- render() {
78
- const { borderColor, borderRadius = 4, borderWidth = 1, children, color = "rgba(0, 122, 255, 1)", style, unfilledColor, width = 150, ...restProps } = this.props;
79
- const innerWidth = Math.max(0, width || this.state.width) - borderWidth * 2;
80
- const containerStyle = {
81
- width,
82
- borderWidth,
83
- borderColor: borderColor || color,
84
- borderRadius,
85
- overflow: "hidden",
86
- backgroundColor: unfilledColor,
87
- };
88
- const progressStyle = {
89
- backgroundColor: color,
90
- // Always take up full height of container.
91
- height: "100%",
92
- transform: [
93
- {
94
- translateX: this.state.animationValue.interpolate({
95
- inputRange: [0, 1],
96
- outputRange: [innerWidth * -INDETERMINATE_WIDTH_FACTOR, innerWidth],
97
- }),
98
- },
99
- {
100
- translateX: this.state.progress.interpolate({
101
- inputRange: [0, 1],
102
- outputRange: [innerWidth / (I18nManager.isRTL ? 2 : -2), 0],
103
- }),
104
- },
105
- {
106
- // Interpolation a temp workaround for https://github.com/facebook/react-native/issues/6278
107
- scaleX: this.state.progress.interpolate({
108
- inputRange: [0, 1],
109
- outputRange: [0.0001, 1],
110
- }),
111
- },
112
- ],
113
- };
114
- return (React.createElement(View, { style: [containerStyle, style], onLayout: this.handleLayout, ...restProps },
115
- React.createElement(Animated.View, { style: progressStyle }),
116
- children));
117
- }
118
- }
@@ -1,13 +0,0 @@
1
- import * as React from "react";
2
- import { Text } from "react-native";
3
- import AnimatedCircularProgress from "./AnimatedCircularProgress";
4
- import { withTheme } from "../theming";
5
- const ProgressCircle = ({ progress = 0.5, style, color = "primary", size = 100, showsText = true, unfilledColor, strokeCap = "butt", textStyle, thickness = 1, theme, }) => {
6
- const progressNum = Math.round(progress * 100);
7
- const tintColor = color || theme.colors.primary;
8
- const backgroundColor = unfilledColor || theme.colors.secondary;
9
- return (React.createElement(AnimatedCircularProgress, { size: size, width: thickness, backgroundWidth: thickness, fill: progressNum, tintColor: tintColor, backgroundColor: backgroundColor, rotation: 0, lineCap: strokeCap, style: style }, (fill) => showsText ? (React.createElement(Text, { style: [{ fontSize: size * 0.275, color: tintColor }, textStyle] },
10
- Math.round(fill),
11
- "%")) : null));
12
- };
13
- export default withTheme(ProgressCircle);
@@ -1,27 +0,0 @@
1
- import * as React from "react";
2
- import StepIndicator from "./StepIndicator";
3
- import { withTheme } from "../theming";
4
- const ProgressIndicator = ({ numberOfSteps, currentStep, currentStepStrokeWidth = 3, stepStrokeCurrentColor = "primary", stepIndicatorSize, currentStepIndicatorSize, stepIndicatorCurrentColor, stepIndicatorLabelCurrentColor, stepIndicatorLabelFontSize = 12, stepNumberFinishedColor = "strongInverse", stepNumberUnfinishedColor = "primary", unfinishedColor = "light", finishedColor = "primary", theme, }) => {
5
- const currentPosition = currentStep - 1;
6
- return (React.createElement(StepIndicator, { stepCount: numberOfSteps, currentPosition: currentPosition, customStyles: {
7
- stepIndicatorSize,
8
- currentStepIndicatorSize: currentStepIndicatorSize
9
- ? currentStepIndicatorSize
10
- : stepIndicatorSize,
11
- stepStrokeFinishedColor: finishedColor,
12
- stepStrokeUnFinishedColor: unfinishedColor,
13
- separatorFinishedColor: finishedColor,
14
- separatorUnFinishedColor: unfinishedColor,
15
- stepIndicatorFinishedColor: finishedColor,
16
- stepIndicatorUnFinishedColor: unfinishedColor,
17
- currentStepStrokeWidth,
18
- stepStrokeCurrentColor: stepStrokeCurrentColor || stepIndicatorCurrentColor,
19
- stepIndicatorLabelUnFinishedColor: stepNumberUnfinishedColor,
20
- stepIndicatorLabelFinishedColor: stepNumberFinishedColor,
21
- stepIndicatorCurrentColor: stepIndicatorCurrentColor || unfinishedColor,
22
- stepIndicatorLabelCurrentColor: stepIndicatorLabelCurrentColor || stepNumberUnfinishedColor,
23
- stepIndicatorLabelFontSize,
24
- labelFontFamily: theme.typography.body1.fontFamily,
25
- } }));
26
- };
27
- export default withTheme(ProgressIndicator);
@@ -1,17 +0,0 @@
1
- import * as React from "react";
2
- import Config from "../Config";
3
- import IconButton from "../IconButton";
4
- import { getValueForRadioButton } from "../../utilities";
5
- import { useRadioButtonGroupContext } from "./context";
6
- const RadioButton = ({ Icon, disabled = false, color, value = "", selected, unselectedColor, onPress, size = Config.radioButtonSize, selectedIcon = "MaterialIcons/radio-button-checked", unselectedIcon = "MaterialIcons/radio-button-unchecked", style, ...rest }) => {
7
- const { value: contextValue, onValueChange } = useRadioButtonGroupContext();
8
- const realValue = getValueForRadioButton(value);
9
- const realContextValue = getValueForRadioButton(contextValue);
10
- const isSelected = selected !== null && selected !== void 0 ? selected : realContextValue === realValue;
11
- const handlePress = () => {
12
- onPress === null || onPress === void 0 ? void 0 : onPress(realValue);
13
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(realValue);
14
- };
15
- return (React.createElement(IconButton, { Icon: Icon, icon: isSelected ? selectedIcon : unselectedIcon, color: isSelected ? color : unselectedColor, disabled: disabled, onPress: handlePress, size: size, style: style, ...rest }));
16
- };
17
- export default RadioButton;
@@ -1,17 +0,0 @@
1
- import React from "react";
2
- import { View } from "react-native";
3
- import Text from "../Text";
4
- import { withTheme } from "../../theming";
5
- import RadioButtonGroup from "./RadioButtonGroup";
6
- const RadioButtonFieldGroup = ({ label, children, theme, labelStyle, style, ...rest }) => {
7
- return (React.createElement(View, { style: style },
8
- React.createElement(Text, { style: [
9
- {
10
- fontSize: theme.typography.headline4.fontSize,
11
- color: theme.typography.headline4.color,
12
- },
13
- labelStyle,
14
- ] }, label),
15
- React.createElement(RadioButtonGroup, { theme: theme, ...rest }, children)));
16
- };
17
- export default withTheme(RadioButtonFieldGroup);
@@ -1,43 +0,0 @@
1
- import * as React from "react";
2
- import { View } from "react-native";
3
- import { getValueForRadioButton } from "../../utilities";
4
- import { radioButtonGroupContext, Direction } from "./context";
5
- const { Provider } = radioButtonGroupContext;
6
- const RadioButtonGroup = ({ direction = Direction.Vertical, value = "", onValueChange, defaultValue, style, children, ...rest }) => {
7
- const [internalValue, setInternalValue] = React.useState("");
8
- React.useEffect(() => {
9
- if (value != null) {
10
- const realValue = getValueForRadioButton(value);
11
- setInternalValue(realValue);
12
- }
13
- }, [value]);
14
- React.useEffect(() => {
15
- if (defaultValue != null) {
16
- const realDefaultValue = getValueForRadioButton(defaultValue);
17
- setInternalValue(realDefaultValue);
18
- }
19
- }, [defaultValue]);
20
- const handleValueChange = (newValue) => {
21
- const realNewValue = getValueForRadioButton(newValue);
22
- setInternalValue(realNewValue);
23
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(realNewValue);
24
- };
25
- const _containerStyle = [
26
- {
27
- flexDirection: direction === Direction.Horizontal ? "row" : "column",
28
- },
29
- ];
30
- if (direction !== Direction.Vertical) {
31
- _containerStyle.push({
32
- alignItems: "center",
33
- });
34
- }
35
- return (React.createElement(View, { style: [{ minHeight: 40 }, style], ...rest },
36
- React.createElement(Provider, { value: {
37
- value: internalValue,
38
- onValueChange: handleValueChange,
39
- direction,
40
- } },
41
- React.createElement(View, { style: _containerStyle }, children))));
42
- };
43
- export default RadioButtonGroup;
@@ -1,76 +0,0 @@
1
- import * as React from "react";
2
- import { StyleSheet, View, Platform, } from "react-native";
3
- import RadioButton from "./RadioButton";
4
- import Text from "../Text";
5
- import { useRadioButtonGroupContext } from "./context";
6
- import { Direction as GroupDirection } from "./context";
7
- import Touchable from "../Touchable";
8
- import { extractStyles, getValueForRadioButton } from "../../utilities";
9
- export var Direction;
10
- (function (Direction) {
11
- Direction["Row"] = "row";
12
- Direction["RowReverse"] = "row-reverse";
13
- })(Direction || (Direction = {}));
14
- const getRadioButtonAlignment = (parentDirection, direction) => {
15
- if (parentDirection === GroupDirection.Horizontal) {
16
- return direction === Direction.Row ? "flex-start" : "flex-end";
17
- }
18
- else if (direction === Direction.RowReverse) {
19
- return "flex-start";
20
- }
21
- else {
22
- return "flex-end";
23
- }
24
- };
25
- const renderLabel = (value, labelStyle, textStyle) => {
26
- if (typeof value === "string") {
27
- return React.createElement(Text, { style: [labelStyle, textStyle] }, value);
28
- }
29
- else {
30
- return React.createElement(React.Fragment, null, value);
31
- }
32
- };
33
- const RadioButtonRow = ({ Icon, label, value = "", color, unselectedColor, onPress, labelContainerStyle, labelStyle, radioButtonStyle, direction = Direction.Row, selected, disabled, style, ...rest }) => {
34
- const { value: contextValue, onValueChange, direction: parentDirection, } = useRadioButtonGroupContext();
35
- const realValue = getValueForRadioButton(value);
36
- const realContextValue = getValueForRadioButton(contextValue);
37
- const isSelected = selected !== null && selected !== void 0 ? selected : realContextValue === realValue;
38
- const handlePress = () => {
39
- onPress === null || onPress === void 0 ? void 0 : onPress(realValue);
40
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(realValue);
41
- };
42
- const { textStyles, viewStyles } = extractStyles(style);
43
- return (React.createElement(Touchable, { 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: getRadioButtonAlignment(parentDirection, direction),
54
- } },
55
- React.createElement(RadioButton, { Icon: Icon, selected: isSelected, value: realValue, color: color, unselectedColor: unselectedColor, style: radioButtonStyle }))));
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 RadioButtonRow;
@@ -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 radioButtonGroupContext = createContext({
8
- onValueChange: () => { },
9
- value: "",
10
- direction: undefined,
11
- });
12
- export function useRadioButtonGroupContext() {
13
- return useContext(radioButtonGroupContext);
14
- }
@@ -1,4 +0,0 @@
1
- export { default as RadioButton } from "./RadioButton";
2
- export { default as RadioButtonGroup } from "./RadioButtonGroup";
3
- export { default as RadioButtonRow } from "./RadioButtonRow";
4
- export { default as RadioButtonFieldGroup } from "./RadioButtonFieldGroup";
@@ -1 +0,0 @@
1
- export {};
@@ -1,48 +0,0 @@
1
- import * as React from "react";
2
- import { View, Text, Image, StyleSheet, } from "react-native";
3
- import { withTheme } from "../theming";
4
- import Config from "./Config";
5
- const Row = ({ titleTypeStyle, titleColor, subtitleTypeStyle, subtitleColor, title, subtitle, multilineSubtitle, image, right, style, }) => {
6
- return (React.createElement(View, { style: [styles.container, { padding: 16 }, style] },
7
- React.createElement(View, { style: styles.leftContainer },
8
- image && (React.createElement(Image, { source: typeof image === "string" ? { uri: image } : image, style: {
9
- marginRight: 12,
10
- width: subtitle
11
- ? Config.rowMultiLineImageSize
12
- : Config.rowSingleLineImageSize,
13
- height: subtitle
14
- ? Config.rowMultiLineImageSize
15
- : Config.rowSingleLineImageSize,
16
- } })),
17
- React.createElement(View, { style: styles.textContainer },
18
- React.createElement(Text, { style: [
19
- titleTypeStyle,
20
- {
21
- color: titleColor,
22
- },
23
- ], numberOfLines: 1 }, title),
24
- subtitle ? (React.createElement(Text, { style: [
25
- subtitleTypeStyle,
26
- {
27
- color: subtitleColor,
28
- marginTop: 4,
29
- },
30
- ], numberOfLines: multilineSubtitle ? undefined : 1 }, subtitle)) : null)),
31
- right && right()));
32
- };
33
- const styles = StyleSheet.create({
34
- leftContainer: {
35
- flexDirection: "row",
36
- flex: 1,
37
- },
38
- container: {
39
- flexDirection: "row",
40
- justifyContent: "space-between",
41
- alignItems: "center",
42
- },
43
- textContainer: {
44
- flex: 1,
45
- justifyContent: "center",
46
- },
47
- });
48
- export default withTheme(Row);
@@ -1,8 +0,0 @@
1
- import * as React from "react";
2
- import { withTheme } from "../theming";
3
- import Row from "./Row";
4
- import Config from "./Config";
5
- const RowBodyIcon = ({ Icon, title, subtitle, icon, style, theme: { colors, typography }, }) => {
6
- return (React.createElement(Row, { titleTypeStyle: typography.body1, titleColor: colors.medium, subtitleTypeStyle: typography.subtitle2, subtitleColor: colors.light, title: title, subtitle: subtitle, right: () => (React.createElement(Icon, { name: icon, size: Config.rowSingleLineIconSize, color: colors.light, style: { marginLeft: 16 } })), style: style }));
7
- };
8
- export default withTheme(RowBodyIcon);
@@ -1,12 +0,0 @@
1
- import * as React from "react";
2
- import { Text } from "react-native";
3
- import { withTheme } from "../theming";
4
- import Row from "./Row";
5
- const RowHeadlineImageCaption = ({ title, subtitle, caption, image, style, theme: { colors, typography }, }) => {
6
- return (React.createElement(Row, { titleTypeStyle: typography.headline6, titleColor: colors.strong, subtitleTypeStyle: typography.body2, subtitleColor: colors.medium, title: title, subtitle: subtitle, image: image, right: () => (React.createElement(Text, { style: {
7
- ...typography.caption,
8
- color: colors.strong,
9
- marginLeft: 16,
10
- } }, caption)), style: style }));
11
- };
12
- export default withTheme(RowHeadlineImageCaption);
@@ -1,14 +0,0 @@
1
- import * as React from "react";
2
- import { withTheme } from "../theming";
3
- import Row from "./Row";
4
- import Config from "./Config";
5
- const RowHeadlineImageIcon = ({ Icon, icon, title, image, subtitle, multilineSubtitle = false, style, theme: { colors, typography }, }) => {
6
- return (React.createElement(Row, { titleTypeStyle: typography.headline6, titleColor: colors.strong, subtitleTypeStyle: typography.body2, subtitleColor: colors.medium, title: title, subtitle: subtitle, multilineSubtitle: multilineSubtitle, image: image, right: () => (React.createElement(Icon, { name: icon, size: multilineSubtitle
7
- ? Config.rowMultiLineIconSize
8
- : Config.rowSingleLineIconSize, color: colors.light, style: {
9
- marginLeft: 16,
10
- alignSelf: multilineSubtitle ? "flex-start" : "center",
11
- marginTop: multilineSubtitle ? 4 : 0,
12
- } })), style: style }));
13
- };
14
- export default withTheme(RowHeadlineImageIcon);
@@ -1,13 +0,0 @@
1
- import * as React from "react";
2
- import { View, Platform, Image } from "react-native";
3
- import { SvgUri } from "react-native-svg";
4
- import Config from "./Config";
5
- const SVG = ({ source = Config.placeholderSvgURL, style, }) => {
6
- return (React.createElement(React.Fragment, null,
7
- Platform.OS === "ios" && (React.createElement(View, { style: style },
8
- React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
9
- Platform.OS === "android" && (React.createElement(View, { style: style },
10
- React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
11
- Platform.OS === "web" && (React.createElement(Image, { style: style, source: { uri: source } }))));
12
- };
13
- export default SVG;