@draftbit/core 46.7.9-157e2b.2 → 46.7.9-193328.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 (79) hide show
  1. package/lib/commonjs/components/DatePicker/DatePicker.js +14 -1
  2. package/lib/commonjs/components/DeckSwiper/DeckSwiper.js +74 -0
  3. package/lib/commonjs/components/DeckSwiper/DeckSwiperCard.js +34 -0
  4. package/lib/commonjs/components/DeckSwiper/index.js +20 -0
  5. package/lib/commonjs/components/DeprecatedFAB.js +3 -21
  6. package/lib/commonjs/components/NumberInput.js +10 -10
  7. package/lib/commonjs/components/Picker/Picker.js +10 -3
  8. package/lib/commonjs/index.js +13 -0
  9. package/lib/commonjs/mappings/DatePicker.js +8 -2
  10. package/lib/commonjs/mappings/DeckSwiper.js +55 -0
  11. package/lib/commonjs/mappings/DeckSwiperCard.js +23 -0
  12. package/lib/commonjs/mappings/HtmlElements.js +177 -0
  13. package/lib/commonjs/mappings/Picker.js +5 -0
  14. package/lib/module/components/CircleImage.js +1 -16
  15. package/lib/module/components/DatePicker/DatePicker.js +15 -2
  16. package/lib/module/components/DeckSwiper/DeckSwiper.js +66 -0
  17. package/lib/module/components/DeckSwiper/DeckSwiperCard.js +26 -0
  18. package/lib/module/components/DeckSwiper/index.js +2 -0
  19. package/lib/module/components/NumberInput.js +10 -10
  20. package/lib/module/components/Picker/Picker.js +11 -4
  21. package/lib/module/index.js +1 -0
  22. package/lib/module/mappings/DatePicker.js +9 -3
  23. package/lib/module/mappings/DeckSwiper.js +48 -0
  24. package/lib/module/mappings/DeckSwiperCard.js +16 -0
  25. package/lib/module/mappings/HtmlElements.js +170 -0
  26. package/lib/module/mappings/Picker.js +6 -1
  27. package/lib/typescript/src/components/DatePicker/DatePicker.d.ts +1 -0
  28. package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map +1 -1
  29. package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts +15 -0
  30. package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts.map +1 -0
  31. package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts +13 -0
  32. package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts.map +1 -0
  33. package/lib/typescript/src/components/DeckSwiper/index.d.ts +3 -0
  34. package/lib/typescript/src/components/DeckSwiper/index.d.ts.map +1 -0
  35. package/lib/typescript/src/components/Picker/Picker.d.ts +1 -0
  36. package/lib/typescript/src/components/Picker/Picker.d.ts.map +1 -1
  37. package/lib/typescript/src/index.d.ts +1 -0
  38. package/lib/typescript/src/index.d.ts.map +1 -1
  39. package/lib/typescript/src/mappings/DatePicker.d.ts +10 -0
  40. package/lib/typescript/src/mappings/DatePicker.d.ts.map +1 -1
  41. package/lib/typescript/src/mappings/DeckSwiper.d.ts +86 -0
  42. package/lib/typescript/src/mappings/DeckSwiper.d.ts.map +1 -0
  43. package/lib/typescript/src/mappings/DeckSwiperCard.d.ts +16 -0
  44. package/lib/typescript/src/mappings/DeckSwiperCard.d.ts.map +1 -0
  45. package/lib/typescript/src/mappings/HtmlElements.d.ts +77 -0
  46. package/lib/typescript/src/mappings/HtmlElements.d.ts.map +1 -0
  47. package/lib/typescript/src/mappings/Picker.d.ts +10 -0
  48. package/lib/typescript/src/mappings/Picker.d.ts.map +1 -1
  49. package/package.json +5 -3
  50. package/src/components/DatePicker/DatePicker.js +8 -3
  51. package/src/components/DatePicker/DatePicker.tsx +10 -1
  52. package/src/components/DeckSwiper/DeckSwiper.js +35 -0
  53. package/src/components/DeckSwiper/DeckSwiper.tsx +94 -0
  54. package/src/components/DeckSwiper/DeckSwiperCard.js +21 -0
  55. package/src/components/DeckSwiper/DeckSwiperCard.tsx +41 -0
  56. package/src/components/DeckSwiper/index.js +2 -0
  57. package/src/components/DeckSwiper/index.tsx +2 -0
  58. package/src/components/NumberInput.js +9 -9
  59. package/src/components/NumberInput.tsx +11 -11
  60. package/src/components/Picker/Picker.js +9 -3
  61. package/src/components/Picker/Picker.tsx +14 -2
  62. package/src/index.js +1 -0
  63. package/src/index.tsx +2 -0
  64. package/src/mappings/DatePicker.js +8 -2
  65. package/src/mappings/DatePicker.ts +8 -1
  66. package/src/mappings/DeckSwiper.js +48 -0
  67. package/src/mappings/DeckSwiper.ts +57 -0
  68. package/src/mappings/DeckSwiperCard.js +16 -0
  69. package/src/mappings/DeckSwiperCard.ts +20 -0
  70. package/src/mappings/HtmlElements.js +193 -0
  71. package/src/mappings/HtmlElements.ts +207 -0
  72. package/src/mappings/Picker.js +6 -1
  73. package/src/mappings/Picker.ts +6 -0
  74. package/lib/commonjs/mappings/expo/Image.js +0 -90
  75. package/lib/module/mappings/expo/Image.js +0 -83
  76. package/lib/typescript/src/mappings/expo/Image.d.ts +0 -155
  77. package/lib/typescript/src/mappings/expo/Image.d.ts.map +0 -1
  78. package/src/mappings/expo/Image.js +0 -107
  79. package/src/mappings/expo/Image.ts +0 -131
@@ -48,6 +48,7 @@ const DatePicker = _ref => {
48
48
  placeholder,
49
49
  borderColor: inputBorderColor,
50
50
  borderColorActive: inputBorderColorActive,
51
+ autoDismissKeyboard = true,
51
52
  ...props
52
53
  } = _ref;
53
54
  const [value, setValue] = React.useState(date || defaultValue);
@@ -143,6 +144,11 @@ const DatePicker = _ref => {
143
144
  clearTimeout(_showPlaceholder());
144
145
  };
145
146
  }, [focused, label, placeholder]);
147
+ React.useEffect(() => {
148
+ if (pickerVisible && autoDismissKeyboard) {
149
+ _reactNative.Keyboard.dismiss();
150
+ }
151
+ }, [pickerVisible, autoDismissKeyboard]);
146
152
  const _handleFocus = () => {
147
153
  if (disabled) {
148
154
  return;
@@ -160,7 +166,14 @@ const DatePicker = _ref => {
160
166
  const MAXIMIZED_LABEL_FONT_SIZE = textStyles.fontSize || typography.subtitle1.fontSize;
161
167
  const MINIMIZED_LABEL_FONT_SIZE = labelSize ? labelSize : typography.caption.fontSize;
162
168
  const hasActiveOutline = focused;
163
- let inputTextColor, activeColor, underlineColor, borderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
169
+ let inputTextColor,
170
+ activeColor,
171
+ underlineColor,
172
+ borderColor = inputBorderColor,
173
+ placeholderColor,
174
+ containerStyle,
175
+ backgroundColor,
176
+ inputStyle;
164
177
  inputTextColor = colors.strong;
165
178
  if (disabled) {
166
179
  activeColor = colors.light;
@@ -0,0 +1,74 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _reactNative = require("react-native");
9
+ var _reactNativeDeckSwiper = _interopRequireDefault(require("react-native-deck-swiper"));
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+ const DeckSwiper = _ref => {
12
+ let {
13
+ onIndexChanged,
14
+ onEndReached,
15
+ startCardIndex = 0,
16
+ infiniteSwiping = false,
17
+ verticalEnabled = true,
18
+ horizontalEnabled = true,
19
+ visibleCardCount = 1,
20
+ style,
21
+ children
22
+ } = _ref;
23
+ const childrenArray = _react.default.useMemo(() => _react.default.Children.toArray(children), [children]);
24
+
25
+ // an array of indices based on children count
26
+ const cardsFillerData = _react.default.useMemo(() => Array.from(Array(childrenArray.length).keys()), [childrenArray]);
27
+
28
+ /**
29
+ * By default react-native-deck-swiper positions everything with absolute position.
30
+ * To overcome this, it is wrapped in a View to be able to add the component in any layout structure.
31
+ *
32
+ *
33
+ * Since all children of that View are absolutley positioned, the View does not have a height and still looks and behaves weird.
34
+ * To fix/mitage this without setting a static height, the first card is rendered in invisible state to take up space.
35
+ * This effectivley makes the default height of the container be the height of the first card.
36
+ */
37
+
38
+ return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
39
+ style: styles.containerHeightFiller
40
+ }, childrenArray.length && childrenArray[0]), /*#__PURE__*/_react.default.createElement(_reactNativeDeckSwiper.default, {
41
+ cards: cardsFillerData,
42
+ renderCard: (_, i) => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, childrenArray[i]),
43
+ keyExtractor: card => card === null || card === void 0 ? void 0 : card.toString(),
44
+ containerStyle: _reactNative.StyleSheet.flatten([styles.cardsContainer, style]),
45
+ cardStyle: styles.card,
46
+ onSwiped: onIndexChanged,
47
+ onSwipedAll: onEndReached,
48
+ cardIndex: startCardIndex,
49
+ infinite: infiniteSwiping,
50
+ verticalSwipe: verticalEnabled,
51
+ horizontalSwipe: horizontalEnabled,
52
+ showSecondCard: visibleCardCount > 1,
53
+ stackSize: visibleCardCount,
54
+ backgroundColor: "transparent",
55
+ cardVerticalMargin: 0,
56
+ cardHorizontalMargin: 0
57
+ }));
58
+ };
59
+ const styles = _reactNative.StyleSheet.create({
60
+ cardsContainer: {
61
+ width: "100%"
62
+ },
63
+ card: {
64
+ left: 0,
65
+ right: 0,
66
+ width: "auto",
67
+ height: "auto"
68
+ },
69
+ containerHeightFiller: {
70
+ opacity: 0.0
71
+ }
72
+ });
73
+ var _default = DeckSwiper;
74
+ exports.default = _default;
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _reactNative = require("react-native");
9
+ var _theming = require("../../theming");
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+ const DeckSwiperCard = _ref => {
12
+ let {
13
+ style,
14
+ children,
15
+ theme
16
+ } = _ref;
17
+ return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
18
+ style: [styles.card, {
19
+ backgroundColor: theme.colors.background,
20
+ borderColor: theme.colors.divider
21
+ }, style]
22
+ }, children);
23
+ };
24
+ const styles = _reactNative.StyleSheet.create({
25
+ card: {
26
+ flex: 1,
27
+ alignItems: "center",
28
+ justifyContent: "center",
29
+ padding: 20,
30
+ borderWidth: 2
31
+ }
32
+ });
33
+ var _default = (0, _theming.withTheme)(DeckSwiperCard);
34
+ exports.default = _default;
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "DeckSwiper", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _DeckSwiper.default;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "DeckSwiperCard", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _DeckSwiperCard.default;
16
+ }
17
+ });
18
+ var _DeckSwiper = _interopRequireDefault(require("./DeckSwiper"));
19
+ var _DeckSwiperCard = _interopRequireDefault(require("./DeckSwiperCard"));
20
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -14,6 +14,7 @@ var _theming = require("../theming");
14
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
15
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
16
16
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
17
18
  const FAB = _ref => {
18
19
  let {
19
20
  Icon,
@@ -105,8 +106,7 @@ const FAB = _ref => {
105
106
  style: [{
106
107
  elevation
107
108
  }, style]
108
- }, /*#__PURE__*/React.createElement(_reactNative.Pressable, {
109
- ...rest,
109
+ }, /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({}, rest, {
110
110
  onPress: onPress,
111
111
  accessibilityState: {
112
112
  disabled
@@ -114,7 +114,7 @@ const FAB = _ref => {
114
114
  accessibilityRole: "button",
115
115
  disabled: disabled || loading,
116
116
  style: buttonStyles
117
- }, /*#__PURE__*/React.createElement(_reactNative.View, {
117
+ }), /*#__PURE__*/React.createElement(_reactNative.View, {
118
118
  style: styles.content
119
119
  }, icon && loading !== true ? /*#__PURE__*/React.createElement(_reactNative.View, {
120
120
  style: iconStyle
@@ -154,22 +154,4 @@ const styles = _reactNative.StyleSheet.create({
154
154
  }
155
155
  });
156
156
  var _default = (0, _theming.withTheme)(FAB);
157
- exports.default = _default;ow",
158
- alignItems: "center",
159
- justifyContent: "center"
160
- },
161
- icon: {
162
- alignItems: "center",
163
- justifyContent: "center",
164
- width: _Config.default.buttonIconSize
165
- },
166
- fixed: {
167
- left: 0,
168
- right: 0,
169
- bottom: 0,
170
- height: 64,
171
- borderRadius: 0
172
- }
173
- });
174
- var _default = (0, _theming.withTheme)(FAB);
175
157
  exports.default = _default;
@@ -32,17 +32,8 @@ const NumberInput = _ref => {
32
32
  return valueToFormat.toString();
33
33
  }
34
34
  }
35
- return "0";
35
+ return "";
36
36
  };
37
-
38
- // set currentStringNumberValue as defaultValue prop if there is a differnce on first render only
39
- (0, _react.useEffect)(() => {
40
- const defaultStringNumberValue = formatValueToStringNumber(defaultValue);
41
- if (currentStringNumberValue !== defaultStringNumberValue) {
42
- setCurrentStringNumberValue(defaultStringNumberValue);
43
- }
44
- // eslint-disable-next-line react-hooks/exhaustive-deps
45
- }, []);
46
37
  const handleChangeText = newValue => {
47
38
  const newStringNumberValue = formatValueToStringNumber(newValue);
48
39
  const number = parseFloat(newStringNumberValue);
@@ -58,6 +49,15 @@ const NumberInput = _ref => {
58
49
  }
59
50
  // eslint-disable-next-line react-hooks/exhaustive-deps
60
51
  }, [value]);
52
+
53
+ // set currentStringNumberValue as defaultValue prop if there is a differnce on first render only
54
+ (0, _react.useEffect)(() => {
55
+ const defaultStringNumberValue = formatValueToStringNumber(defaultValue);
56
+ if (currentStringNumberValue !== defaultStringNumberValue) {
57
+ setCurrentStringNumberValue(defaultStringNumberValue);
58
+ }
59
+ // eslint-disable-next-line react-hooks/exhaustive-deps
60
+ }, []);
61
61
  return /*#__PURE__*/_react.default.createElement(_reactNative.TextInput, _extends({
62
62
  keyboardType: "numeric",
63
63
  value: currentStringNumberValue,
@@ -42,6 +42,7 @@ const {
42
42
  height: deviceHeight
43
43
  } = _reactNative.Dimensions.get("screen");
44
44
  const isIos = _reactNative.Platform.OS === "ios";
45
+ const isWeb = _reactNative.Platform.OS === "web";
45
46
  const unstyledColor = "rgba(165, 173, 183, 1)";
46
47
  const disabledColor = "rgb(240, 240, 240)";
47
48
  const errorColor = "rgba(255, 69, 100, 1)";
@@ -65,7 +66,8 @@ const Picker = _ref => {
65
66
  leftIconName,
66
67
  placeholderTextColor = unstyledColor,
67
68
  rightIconName,
68
- type = "solid"
69
+ type = "solid",
70
+ autoDismissKeyboard = true
69
71
  } = _ref;
70
72
  const androidPickerRef = React.useRef(undefined);
71
73
  const [internalValue, setInternalValue] = React.useState(value || defaultValue);
@@ -89,6 +91,11 @@ const Picker = _ref => {
89
91
  androidPickerRef === null || androidPickerRef === void 0 ? void 0 : (_androidPickerRef$cur = androidPickerRef.current) === null || _androidPickerRef$cur === void 0 ? void 0 : _androidPickerRef$cur.focus();
90
92
  }
91
93
  }, [pickerVisible, androidPickerRef]);
94
+ React.useEffect(() => {
95
+ if (pickerVisible && autoDismissKeyboard) {
96
+ _reactNative.Keyboard.dismiss();
97
+ }
98
+ }, [pickerVisible, autoDismissKeyboard]);
92
99
  const normalizedOptions = normalizeOptions(options);
93
100
  const pickerOptions = placeholder ? [{
94
101
  value: placeholder,
@@ -233,8 +240,8 @@ const Picker = _ref => {
233
240
  label: option.label,
234
241
  value: option.value,
235
242
  key: option.value
236
- })))))) : null, !isIos && pickerVisible ? /*#__PURE__*/React.createElement(_picker.Picker, {
237
- enabled: pickerVisible,
243
+ })))))) : null, !isIos && (pickerVisible || isWeb) ? /*#__PURE__*/React.createElement(_picker.Picker, {
244
+ enabled: !disabled,
238
245
  selectedValue: internalValue,
239
246
  onValueChange: handleValueChange,
240
247
  style: styles.nonIosPicker,
@@ -123,6 +123,18 @@ Object.defineProperty(exports, "DatePicker", {
123
123
  return _DatePicker.default;
124
124
  }
125
125
  });
126
+ Object.defineProperty(exports, "DeckSwiper", {
127
+ enumerable: true,
128
+ get: function () {
129
+ return _DeckSwiper.DeckSwiper;
130
+ }
131
+ });
132
+ Object.defineProperty(exports, "DeckSwiperCard", {
133
+ enumerable: true,
134
+ get: function () {
135
+ return _DeckSwiper.DeckSwiperCard;
136
+ }
137
+ });
126
138
  Object.defineProperty(exports, "DefaultTheme", {
127
139
  enumerable: true,
128
140
  get: function () {
@@ -401,6 +413,7 @@ var _ActionSheet = require("./components/ActionSheet");
401
413
  var _Swiper = require("./components/Swiper");
402
414
  var _Layout = require("./components/Layout");
403
415
  var _index = require("./components/RadioButton/index");
416
+ var _DeckSwiper = require("./components/DeckSwiper");
404
417
  var _DatePicker = _interopRequireDefault(require("./components/DatePicker/DatePicker"));
405
418
  var _Picker = _interopRequireDefault(require("./components/Picker/Picker"));
406
419
  var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));
@@ -37,7 +37,8 @@ const SEED_DATA_PROPS = {
37
37
  label: "Border Color"
38
38
  }),
39
39
  borderColorActive: (0, _types.createColorProp)({
40
- label: "Border Color"
40
+ label: "Active Border Color",
41
+ description: "Color of border when date picker is active"
41
42
  }),
42
43
  format: {
43
44
  label: "Format",
@@ -169,7 +170,12 @@ const SEED_DATA = [{
169
170
  editable: true,
170
171
  required: true,
171
172
  group: _types.GROUPS.basic
172
- }
173
+ },
174
+ autoDismissKeyboard: (0, _types.createStaticBoolProp)({
175
+ label: "Auto dismiss keyboard",
176
+ description: "Automatically dismiss keyboard when DatePicker is opened",
177
+ defaultValue: true
178
+ })
173
179
  }
174
180
  }];
175
181
  exports.SEED_DATA = SEED_DATA;
@@ -0,0 +1,55 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SEED_DATA = void 0;
7
+ var _types = require("@draftbit/types");
8
+ const SEED_DATA = {
9
+ name: "Deck Swiper",
10
+ tag: "DeckSwiper",
11
+ description: "Deck swiper container",
12
+ category: _types.COMPONENT_TYPES.swiper,
13
+ stylesPanelSections: _types.BLOCK_STYLES_SECTIONS,
14
+ layout: {
15
+ width: "100%"
16
+ },
17
+ triggers: [_types.Triggers.OnIndexChanged, _types.Triggers.OnEndReached],
18
+ props: {
19
+ onIndexChanged: (0, _types.createActionProp)({
20
+ label: "On index changed",
21
+ description: "Action to execute when swipe to new index"
22
+ }),
23
+ onEndReached: (0, _types.createActionProp)({
24
+ label: "On end reached",
25
+ description: "Action to execute when end of swiping reached"
26
+ }),
27
+ startCardIndex: (0, _types.createStaticNumberProp)({
28
+ label: "Start card index",
29
+ description: "Index of card to start swiping from",
30
+ defaultValue: 0
31
+ }),
32
+ infiniteSwiping: (0, _types.createStaticBoolProp)({
33
+ label: "Infinite swiping",
34
+ description: "Whether to infinitley loop through cards or not"
35
+ }),
36
+ verticalEnabled: (0, _types.createStaticBoolProp)({
37
+ label: "Vertical swipe enabled",
38
+ description: "Whether cards should be swipeable vertically or not",
39
+ defaultValue: true
40
+ }),
41
+ horizontalEnabled: (0, _types.createStaticBoolProp)({
42
+ label: "Horizontal swipe enabled",
43
+ description: "Whether cards should be swipeable horizontally or not",
44
+ defaultValue: true
45
+ }),
46
+ visibleCardCount: (0, _types.createStaticNumberProp)({
47
+ label: "Visible card count",
48
+ description: "Number of cards visible behind (and including) the current card",
49
+ defaultValue: 1,
50
+ min: 1,
51
+ step: 1
52
+ })
53
+ }
54
+ };
55
+ exports.SEED_DATA = SEED_DATA;
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SEED_DATA = void 0;
7
+ var _types = require("@draftbit/types");
8
+ const SEED_DATA = {
9
+ name: "Deck Swiper Card",
10
+ tag: "DeckSwiperCard",
11
+ description: "Single Deck Swiper Card item to be used in DeckSwiper",
12
+ category: _types.COMPONENT_TYPES.swiper,
13
+ stylesPanelSections: _types.CONTAINER_COMPONENT_STYLES_SECTIONS,
14
+ layout: {
15
+ flex: 1,
16
+ alignItems: "center",
17
+ justifyContent: "center",
18
+ padding: 20,
19
+ borderWidth: 2
20
+ },
21
+ props: {}
22
+ };
23
+ exports.SEED_DATA = SEED_DATA;
@@ -0,0 +1,177 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SEED_DATA = void 0;
7
+ var _types = require("@draftbit/types");
8
+ const SEED_DATA_TRIGGERS = [_types.Triggers.OnValueChange];
9
+ const ELEMENT_SEED_DATA = {
10
+ doc_link: "https://www.npmjs.com/package/@expo/html-elements",
11
+ code_link: "https://github.com/expo/expo/tree/master/packages/html-elements",
12
+ packageName: "@expo/html-elements",
13
+ stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Effects],
14
+ layout: {
15
+ margin: 0
16
+ },
17
+ triggers: SEED_DATA_TRIGGERS,
18
+ category: _types.COMPONENT_TYPES.webelement
19
+ };
20
+ const HEADING_SEED_DATA = {
21
+ ...ELEMENT_SEED_DATA,
22
+ category: _types.COMPONENT_TYPES.text,
23
+ props: {
24
+ accessibilityLabel: {
25
+ group: _types.GROUPS.accessibility,
26
+ name: "accessibilityLabel",
27
+ label: "accessibilityLabel",
28
+ description: "Overrides the text that's read by the screen reader when the user interacts with the element. By default, the label is constructed by traversing all the children and accumulating all the Text nodes separated by space.",
29
+ editable: true,
30
+ required: false,
31
+ formType: _types.FORM_TYPES.string,
32
+ propType: _types.PROP_TYPES.STRING,
33
+ defaultValue: null
34
+ },
35
+ selectable: {
36
+ group: _types.GROUPS.advanced,
37
+ name: "selectable",
38
+ label: "selectable",
39
+ description: "Lets the user select text, to use the native copy and paste functionality.",
40
+ editable: true,
41
+ required: false,
42
+ formType: _types.FORM_TYPES.boolean,
43
+ propType: _types.PROP_TYPES.BOOLEAN,
44
+ defaultValue: null
45
+ },
46
+ children: {
47
+ group: _types.GROUPS.data,
48
+ label: "Text",
49
+ description: "Text",
50
+ editable: true,
51
+ required: true,
52
+ formType: _types.FORM_TYPES.string,
53
+ propType: _types.PROP_TYPES.STRING,
54
+ defaultValue: "Your Headline Here"
55
+ }
56
+ }
57
+ };
58
+ const TEXT_SEED_DATA = {
59
+ ...ELEMENT_SEED_DATA,
60
+ category: _types.COMPONENT_TYPES.text,
61
+ props: {
62
+ children: {
63
+ group: _types.GROUPS.data,
64
+ label: "Text",
65
+ description: "Text",
66
+ defaultValue: "Your Text Here",
67
+ editable: true,
68
+ required: true,
69
+ formType: _types.FORM_TYPES.string,
70
+ propType: _types.PROP_TYPES.STRING
71
+ }
72
+ }
73
+ };
74
+ const SEED_DATA = [{
75
+ name: "H1",
76
+ tag: "H1",
77
+ ...HEADING_SEED_DATA
78
+ }, {
79
+ name: "H2",
80
+ tag: "H2",
81
+ ...HEADING_SEED_DATA
82
+ }, {
83
+ name: "H3",
84
+ tag: "H3",
85
+ ...HEADING_SEED_DATA
86
+ }, {
87
+ name: "H4",
88
+ tag: "H4",
89
+ ...HEADING_SEED_DATA
90
+ }, {
91
+ name: "H5",
92
+ tag: "H5",
93
+ ...HEADING_SEED_DATA
94
+ }, {
95
+ name: "H6",
96
+ tag: "H6",
97
+ ...HEADING_SEED_DATA
98
+ }, {
99
+ name: "Anchor",
100
+ tag: "A",
101
+ ...TEXT_SEED_DATA,
102
+ props: {
103
+ href: (0, _types.createTextProp)({
104
+ label: "href",
105
+ description: "Specify the URL",
106
+ defaultValue: ""
107
+ }),
108
+ target: {
109
+ group: _types.GROUPS.basic,
110
+ label: "target",
111
+ description: "decide where link should open",
112
+ formType: _types.FORM_TYPES.flatArray,
113
+ defaultValue: "_blank",
114
+ options: ["_blank", "_self", "_parent", "_top"]
115
+ }
116
+ }
117
+ }, {
118
+ name: "Paragraph",
119
+ tag: "P",
120
+ ...TEXT_SEED_DATA,
121
+ props: {
122
+ // NOTE - Keeping the props commented until we figure out a way to use this props from draftbit side.
123
+ // strong: createBoolProp({
124
+ // label: "Strong",
125
+ // description: "Strong",
126
+ // }),
127
+ // strike: createBoolProp({
128
+ // label: "Strike",
129
+ // description: "Strike through",
130
+ // }),
131
+ // italic: createBoolProp({
132
+ // label: "Italic",
133
+ // description: "Italic Fonts",
134
+ // }),
135
+ // bold: createBoolProp({
136
+ // label: "Bold",
137
+ // description: "Bold",
138
+ // }),
139
+ }
140
+ }, {
141
+ name: "Code",
142
+ tag: "Code",
143
+ ...TEXT_SEED_DATA
144
+ }, {
145
+ name: "Pre",
146
+ tag: "Pre",
147
+ ...TEXT_SEED_DATA
148
+ }, {
149
+ name: "Mark",
150
+ tag: "Mark",
151
+ ...TEXT_SEED_DATA
152
+ }, {
153
+ name: "BR",
154
+ tag: "BR",
155
+ ...TEXT_SEED_DATA
156
+ }, {
157
+ name: "BlockQuote",
158
+ tag: "BlockQuote",
159
+ ...TEXT_SEED_DATA
160
+ }, {
161
+ name: "HR",
162
+ tag: "HR",
163
+ ...TEXT_SEED_DATA
164
+ }, {
165
+ name: "Time",
166
+ tag: "Time",
167
+ ...ELEMENT_SEED_DATA
168
+ }, {
169
+ name: "UL",
170
+ tag: "UL",
171
+ ...ELEMENT_SEED_DATA
172
+ }, {
173
+ name: "LI",
174
+ tag: "LI",
175
+ ...ELEMENT_SEED_DATA
176
+ }];
177
+ exports.SEED_DATA = SEED_DATA;
@@ -142,6 +142,11 @@ const SEED_DATA = [{
142
142
  }),
143
143
  iconColor: (0, _types.createColorProp)({
144
144
  label: "Icon Color"
145
+ }),
146
+ autoDismissKeyboard: (0, _types.createStaticBoolProp)({
147
+ label: "Auto dismiss keyboard",
148
+ description: "Automatically dismiss keyboard when Picker is opened",
149
+ defaultValue: true
145
150
  })
146
151
  },
147
152
  layout: {}
@@ -1,3 +1,4 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
1
2
  import * as React from "react";
2
3
  import { Image } from "react-native";
3
4
  import Config from "./Config";
@@ -9,22 +10,6 @@ const CircleImage = _ref => {
9
10
  ...props
10
11
  } = _ref;
11
12
  const borderRadius = size / 2;
12
- return /*#__PURE__*/React.createElement(Image, {
13
- style: [{
14
- width: size,
15
- height: size,
16
- borderRadius
17
- }, style],
18
- source: typeof source === "string" ? {
19
- uri: source
20
- } : source,
21
- resizeMode: "cover",
22
- ...props
23
- });
24
- };
25
- export default CircleImage;props
26
- } = _ref;
27
- const borderRadius = size / 2;
28
13
  return /*#__PURE__*/React.createElement(Image, _extends({
29
14
  style: [{
30
15
  width: size,
@@ -1,6 +1,6 @@
1
1
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
  import * as React from "react";
3
- import { View, Animated, Text, StyleSheet, I18nManager, TextInput as NativeTextInput } from "react-native";
3
+ import { View, Animated, Text, StyleSheet, I18nManager, TextInput as NativeTextInput, Keyboard } from "react-native";
4
4
  import { useSafeAreaInsets } from "react-native-safe-area-context";
5
5
  import dateFormat from "dateformat";
6
6
  import { withTheme } from "../../theming";
@@ -39,6 +39,7 @@ const DatePicker = _ref => {
39
39
  placeholder,
40
40
  borderColor: inputBorderColor,
41
41
  borderColorActive: inputBorderColorActive,
42
+ autoDismissKeyboard = true,
42
43
  ...props
43
44
  } = _ref;
44
45
  const [value, setValue] = React.useState(date || defaultValue);
@@ -134,6 +135,11 @@ const DatePicker = _ref => {
134
135
  clearTimeout(_showPlaceholder());
135
136
  };
136
137
  }, [focused, label, placeholder]);
138
+ React.useEffect(() => {
139
+ if (pickerVisible && autoDismissKeyboard) {
140
+ Keyboard.dismiss();
141
+ }
142
+ }, [pickerVisible, autoDismissKeyboard]);
137
143
  const _handleFocus = () => {
138
144
  if (disabled) {
139
145
  return;
@@ -151,7 +157,14 @@ const DatePicker = _ref => {
151
157
  const MAXIMIZED_LABEL_FONT_SIZE = textStyles.fontSize || typography.subtitle1.fontSize;
152
158
  const MINIMIZED_LABEL_FONT_SIZE = labelSize ? labelSize : typography.caption.fontSize;
153
159
  const hasActiveOutline = focused;
154
- let inputTextColor, activeColor, underlineColor, borderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
160
+ let inputTextColor,
161
+ activeColor,
162
+ underlineColor,
163
+ borderColor = inputBorderColor,
164
+ placeholderColor,
165
+ containerStyle,
166
+ backgroundColor,
167
+ inputStyle;
155
168
  inputTextColor = colors.strong;
156
169
  if (disabled) {
157
170
  activeColor = colors.light;