@draftbit/core 46.4.4-11985a.2 → 46.4.4-1a94b9.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 (100) hide show
  1. package/lib/commonjs/components/Container.js +5 -17
  2. package/lib/commonjs/components/DatePicker/DatePicker.js +18 -8
  3. package/lib/commonjs/components/Picker/Picker.js +5 -5
  4. package/lib/commonjs/components/Stepper.js +8 -3
  5. package/lib/commonjs/components/Text.js +6 -2
  6. package/lib/commonjs/components/TextField.js +5 -1
  7. package/lib/commonjs/index.js +0 -38
  8. package/lib/commonjs/mappings/DatePicker.js +13 -0
  9. package/lib/commonjs/mappings/Stepper.js +1 -1
  10. package/lib/commonjs/mappings/TextField.js +1 -1
  11. package/lib/commonjs/mappings/TextInput.js +1 -1
  12. package/lib/commonjs/utilities.js +2 -2
  13. package/lib/module/components/Accordion/AccordionItem.js +5 -26
  14. package/lib/module/components/DatePicker/DatePicker.js +25 -15
  15. package/lib/module/components/Image.js +3 -18
  16. package/lib/module/components/Picker/Picker.js +2 -2
  17. package/lib/module/components/Picker/PickerComponent.web.js +5 -23
  18. package/lib/module/components/ScreenContainer.js +5 -22
  19. package/lib/module/components/Stepper.js +7 -3
  20. package/lib/module/components/Text.js +6 -2
  21. package/lib/module/components/TextField.js +5 -1
  22. package/lib/module/constants.js +0 -1
  23. package/lib/module/index.js +0 -1
  24. package/lib/module/mappings/DatePicker.js +14 -1
  25. package/lib/module/mappings/Stepper.js +2 -2
  26. package/lib/module/mappings/TextField.js +1 -1
  27. package/lib/module/mappings/TextInput.js +1 -1
  28. package/lib/module/utilities.js +3 -3
  29. package/lib/typescript/src/components/DatePicker/DatePicker.d.ts +4 -0
  30. package/lib/typescript/src/components/Stepper.d.ts +1 -2
  31. package/lib/typescript/src/components/Text.d.ts +2 -1
  32. package/lib/typescript/src/components/TextField.d.ts +2 -1
  33. package/lib/typescript/src/index.d.ts +0 -1
  34. package/lib/typescript/src/mappings/DatePicker.d.ts +42 -0
  35. package/lib/typescript/src/mappings/TextField.d.ts +2 -2
  36. package/lib/typescript/src/mappings/TextInput.d.ts +1 -1
  37. package/lib/typescript/src/utilities.d.ts +3 -3
  38. package/package.json +3 -3
  39. package/src/components/DatePicker/DatePicker.js +14 -8
  40. package/src/components/DatePicker/DatePicker.tsx +23 -7
  41. package/src/components/Picker/Picker.js +1 -1
  42. package/src/components/Picker/Picker.tsx +2 -2
  43. package/src/components/Stepper.js +5 -3
  44. package/src/components/Stepper.tsx +5 -5
  45. package/src/components/Text.js +8 -2
  46. package/src/components/Text.tsx +6 -1
  47. package/src/components/TextField.js +6 -1
  48. package/src/components/TextField.tsx +7 -1
  49. package/src/index.js +0 -1
  50. package/src/index.tsx +0 -9
  51. package/src/mappings/DatePicker.js +21 -1
  52. package/src/mappings/DatePicker.ts +23 -0
  53. package/src/mappings/Stepper.js +5 -2
  54. package/src/mappings/Stepper.ts +5 -1
  55. package/src/mappings/TextField.js +1 -1
  56. package/src/mappings/TextField.ts +1 -1
  57. package/src/mappings/TextInput.js +1 -1
  58. package/src/mappings/TextInput.ts +1 -1
  59. package/src/utilities.js +2 -5
  60. package/src/utilities.ts +2 -13
  61. package/lib/commonjs/components/Table/Table.js +0 -35
  62. package/lib/commonjs/components/Table/TableCell.js +0 -50
  63. package/lib/commonjs/components/Table/TableHeader.js +0 -41
  64. package/lib/commonjs/components/Table/TablePaginator.js +0 -17
  65. package/lib/commonjs/components/Table/TableRow.js +0 -47
  66. package/lib/commonjs/components/Table/TableTitle.js +0 -60
  67. package/lib/commonjs/components/Table/index.js +0 -55
  68. package/lib/commonjs/mappings/Table.js +0 -102
  69. package/lib/module/components/Table/Table.js +0 -23
  70. package/lib/module/components/Table/TableCell.js +0 -37
  71. package/lib/module/components/Table/TableHeader.js +0 -27
  72. package/lib/module/components/Table/TablePaginator.js +0 -6
  73. package/lib/module/components/Table/TableRow.js +0 -33
  74. package/lib/module/components/Table/TableTitle.js +0 -47
  75. package/lib/module/components/Table/index.js +0 -6
  76. package/lib/module/mappings/Table.js +0 -93
  77. package/lib/typescript/src/components/Table/Table.d.ts +0 -8
  78. package/lib/typescript/src/components/Table/TableCell.d.ts +0 -10
  79. package/lib/typescript/src/components/Table/TableHeader.d.ts +0 -12
  80. package/lib/typescript/src/components/Table/TablePaginator.d.ts +0 -3
  81. package/lib/typescript/src/components/Table/TableRow.d.ts +0 -12
  82. package/lib/typescript/src/components/Table/TableTitle.d.ts +0 -12
  83. package/lib/typescript/src/components/Table/index.d.ts +0 -6
  84. package/lib/typescript/src/mappings/Table.d.ts +0 -148
  85. package/src/components/Table/Table.js +0 -10
  86. package/src/components/Table/Table.tsx +0 -22
  87. package/src/components/Table/TableCell.js +0 -21
  88. package/src/components/Table/TableCell.tsx +0 -44
  89. package/src/components/Table/TableHeader.js +0 -11
  90. package/src/components/Table/TableHeader.tsx +0 -28
  91. package/src/components/Table/TablePaginator.js +0 -5
  92. package/src/components/Table/TablePaginator.tsx +0 -10
  93. package/src/components/Table/TableRow.js +0 -16
  94. package/src/components/Table/TableRow.tsx +0 -31
  95. package/src/components/Table/TableTitle.js +0 -28
  96. package/src/components/Table/TableTitle.tsx +0 -58
  97. package/src/components/Table/index.js +0 -6
  98. package/src/components/Table/index.tsx +0 -6
  99. package/src/mappings/Table.js +0 -136
  100. package/src/mappings/Table.ts +0 -144
@@ -19,6 +19,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
19
19
 
20
20
  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; }
21
21
 
22
+ 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); }
23
+
22
24
  const Container = _ref => {
23
25
  let {
24
26
  useThemeGutterPadding,
@@ -80,10 +82,9 @@ const Container = _ref => {
80
82
  };
81
83
  const Wrap = elevation ? _Elevation.default : _reactNative.View;
82
84
  if (elevation) containerStyle.elevation = elevation;
83
- return /*#__PURE__*/React.createElement(Wrap, {
84
- style: [containerStyle, style],
85
- ...rest
86
- }, backgroundImage ? /*#__PURE__*/React.createElement(_reactNative.ImageBackground, {
85
+ return /*#__PURE__*/React.createElement(Wrap, _extends({
86
+ style: [containerStyle, style]
87
+ }, rest), backgroundImage ? /*#__PURE__*/React.createElement(_reactNative.ImageBackground, {
87
88
  source: typeof backgroundImage === "string" ? {
88
89
  uri: backgroundImage
89
90
  } : backgroundImage,
@@ -100,17 +101,4 @@ const Container = _ref => {
100
101
 
101
102
  var _default = (0, _theming.withTheme)(Container);
102
103
 
103
- exports.default = _default;izeMode: backgroundImageResizeMode,
104
- style: {
105
- flex: 1
106
- }
107
- }, /*#__PURE__*/React.createElement(_reactNative.View, {
108
- style: innerStyle
109
- }, children)) : /*#__PURE__*/React.createElement(_reactNative.View, {
110
- style: innerStyle
111
- }, children));
112
- };
113
-
114
- var _default = (0, _theming.withTheme)(Container);
115
-
116
104
  exports.default = _default;
@@ -21,6 +21,8 @@ var _Touchable = _interopRequireDefault(require("../Touchable"));
21
21
 
22
22
  var _DatePickerComponent = _interopRequireDefault(require("./DatePickerComponent"));
23
23
 
24
+ var _utilities = require("../../utilities");
25
+
24
26
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
27
 
26
28
  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); }
@@ -57,7 +59,11 @@ const DatePicker = _ref => {
57
59
  rightIconName,
58
60
  leftIconMode = "inset",
59
61
  label,
62
+ labelSize,
63
+ labelColor,
60
64
  placeholder,
65
+ borderColor: inputBorderColor,
66
+ borderColorActive: inputBorderColorActive,
61
67
  ...props
62
68
  } = _ref;
63
69
  const [value, setValue] = React.useState(date || defaultValue);
@@ -74,6 +80,9 @@ const DatePicker = _ref => {
74
80
  measured: false,
75
81
  width: 0
76
82
  });
83
+ const {
84
+ textStyles
85
+ } = (0, _utilities.extractStyles)(style);
77
86
 
78
87
  const getValidDate = () => {
79
88
  if (!value) {
@@ -175,8 +184,8 @@ const DatePicker = _ref => {
175
184
 
176
185
  const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
177
186
  const OUTLINE_MINIMIZED_LABEL_Y_OFFSET = -(16 * 0.5 + 4);
178
- const MAXIMIZED_LABEL_FONT_SIZE = typography.subtitle1.fontSize;
179
- const MINIMIZED_LABEL_FONT_SIZE = typography.caption.fontSize;
187
+ const MAXIMIZED_LABEL_FONT_SIZE = (textStyles === null || textStyles === void 0 ? void 0 : textStyles.fontSize) || typography.subtitle1.fontSize;
188
+ const MINIMIZED_LABEL_FONT_SIZE = labelSize ? labelSize : typography.caption.fontSize;
180
189
  const hasActiveOutline = focused;
181
190
  let inputTextColor, activeColor, underlineColor, borderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
182
191
  inputTextColor = colors.strong;
@@ -188,9 +197,9 @@ const DatePicker = _ref => {
188
197
  underlineColor = "transparent";
189
198
  backgroundColor = colors.divider;
190
199
  } else {
191
- activeColor = colors.primary;
192
- placeholderColor = borderColor = colors.light;
193
- underlineColor = colors.light;
200
+ activeColor = inputBorderColorActive || colors.primary;
201
+ placeholderColor = borderColor = inputBorderColor || colors.light;
202
+ underlineColor = inputBorderColor || colors.light;
194
203
  backgroundColor = colors.background;
195
204
  }
196
205
 
@@ -250,6 +259,7 @@ const DatePicker = _ref => {
250
259
  };
251
260
  const labelStyle = { ...typography.subtitle1,
252
261
  top: type === "solid" ? 16 : 0,
262
+ fontFamily: textStyles === null || textStyles === void 0 ? void 0 : textStyles.fontFamily,
253
263
  left: leftIconName && leftIconMode === "inset" ? ICON_SIZE + (type === "solid" ? 16 : 12) : 0,
254
264
  transform: [{
255
265
  // Move label to top
@@ -273,7 +283,7 @@ const DatePicker = _ref => {
273
283
  };
274
284
  const inputStyles = [styles.input, inputStyle, type === "solid" ? {
275
285
  marginHorizontal: 12
276
- } : {}]; // const render = (props) => <NativeTextInput {...props} />;
286
+ } : {}, textStyles]; // const render = (props) => <NativeTextInput {...props} />;
277
287
 
278
288
  return /*#__PURE__*/React.createElement(_reactNative.View, {
279
289
  style: [styles.container, style]
@@ -319,7 +329,7 @@ const DatePicker = _ref => {
319
329
  style: [styles.placeholder, type === "solid" ? {
320
330
  paddingHorizontal: 12
321
331
  } : {}, labelStyle, {
322
- color: colors.light,
332
+ color: labelColor || colors.light,
323
333
  opacity: labeled.interpolate({
324
334
  inputRange: [0, 1],
325
335
  outputRange: [hasActiveOutline ? 1 : 0, 0]
@@ -330,7 +340,7 @@ const DatePicker = _ref => {
330
340
  style: [styles.placeholder, type === "solid" ? {
331
341
  paddingHorizontal: 12
332
342
  } : {}, labelStyle, {
333
- color: placeholderColor,
343
+ color: labelColor || placeholder,
334
344
  opacity: hasActiveOutline ? labeled : 1
335
345
  }],
336
346
  numberOfLines: 1
@@ -284,10 +284,6 @@ const Picker = _ref => {
284
284
  );
285
285
  };
286
286
 
287
- var _default = (0, _theming.withTheme)(Picker);
288
-
289
- exports.default = _default;
290
-
291
287
  const styles = _reactNative.StyleSheet.create({
292
288
  marginsContainer: {
293
289
  alignSelf: "stretch",
@@ -357,4 +353,8 @@ const styles = _reactNative.StyleSheet.create({
357
353
  maxWidth: deviceWidth,
358
354
  maxHeight: deviceHeight
359
355
  }
360
- });
356
+ });
357
+
358
+ var _default = (0, _theming.withTheme)(Picker);
359
+
360
+ exports.default = _default;
@@ -15,6 +15,8 @@ var _theming = require("../theming");
15
15
 
16
16
  var _IconButton = _interopRequireDefault(require("./IconButton"));
17
17
 
18
+ var _utilities = require("../utilities");
19
+
18
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
21
 
20
22
  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); }
@@ -28,7 +30,6 @@ const Stepper = _ref => {
28
30
  value: valueProp,
29
31
  defaultValue,
30
32
  style,
31
- typeStyle,
32
33
  iconSize = 24,
33
34
  iconColor,
34
35
  onChange,
@@ -38,6 +39,10 @@ const Stepper = _ref => {
38
39
  },
39
40
  Icon
40
41
  } = _ref;
42
+ const {
43
+ viewStyles,
44
+ textStyles
45
+ } = (0, _utilities.extractStyles)(style);
41
46
  const [value, setValue] = (0, _react.useState)(defaultValue !== null && defaultValue !== void 0 ? defaultValue : 0);
42
47
 
43
48
  const isValidValue = valueArg => valueArg >= min && valueArg <= max;
@@ -60,7 +65,7 @@ const Stepper = _ref => {
60
65
  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
61
66
  style: [{
62
67
  flexDirection: "row"
63
- }, style]
68
+ }, viewStyles]
64
69
  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
65
70
  Icon: Icon,
66
71
  icon: "MaterialIcons/remove",
@@ -77,7 +82,7 @@ const Stepper = _ref => {
77
82
  alignSelf: "center",
78
83
  color: colors.medium,
79
84
  marginHorizontal: 8
80
- }, typeStyle]
85
+ }, textStyles]
81
86
  }, value), /*#__PURE__*/_react.default.createElement(_IconButton.default, {
82
87
  Icon: Icon,
83
88
  icon: "MaterialIcons/add",
@@ -24,10 +24,14 @@ class Text extends React.Component {
24
24
  super(...arguments);
25
25
 
26
26
  _defineProperty(this, "_root", void 0);
27
+
28
+ _defineProperty(this, "state", {
29
+ nativeProps: {}
30
+ });
27
31
  }
28
32
 
29
33
  setNativeProps(args) {
30
- return this._root && this._root.setNativeProps(args);
34
+ this.state.nativeProps = args || {};
31
35
  }
32
36
 
33
37
  render() {
@@ -36,7 +40,7 @@ class Text extends React.Component {
36
40
  ...rest
37
41
  } = this.props;
38
42
  const writingDirection = _reactNative.I18nManager.isRTL ? "rtl" : "ltr";
39
- return /*#__PURE__*/React.createElement(_reactNative.Text, _extends({}, rest, {
43
+ return /*#__PURE__*/React.createElement(_reactNative.Text, _extends({}, rest, this.state.nativeProps, {
40
44
  ref: c => {
41
45
  this._root = c;
42
46
  },
@@ -32,6 +32,7 @@ class TextField extends React.Component {
32
32
  super(...arguments);
33
33
 
34
34
  _defineProperty(this, "state", {
35
+ nativeProps: {},
35
36
  labeled: new _reactNative.Animated.Value(this.props.value || this.props.error ? 0 : 1),
36
37
  focused: false,
37
38
  placeholder: this.props.error ? this.props.placeholder : "",
@@ -162,7 +163,9 @@ class TextField extends React.Component {
162
163
  * @internal
163
164
  */
164
165
  setNativeProps(args) {
165
- return this._root && this._root.setNativeProps(args);
166
+ this.setState(state => ({ ...state,
167
+ nativeState: args || {}
168
+ }));
166
169
  }
167
170
 
168
171
  isFocused() {
@@ -444,6 +447,7 @@ class TextField extends React.Component {
444
447
  underlineColorAndroid: "transparent",
445
448
  style: inputStyles,
446
449
  ...rest,
450
+ ...this.state.nativeProps,
447
451
  value: this.state.value
448
452
  })), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
449
453
  name: rightIconName,
@@ -369,42 +369,6 @@ Object.defineProperty(exports, "SwitchRow", {
369
369
  return _Switch.SwitchRow;
370
370
  }
371
371
  });
372
- Object.defineProperty(exports, "Table", {
373
- enumerable: true,
374
- get: function () {
375
- return _Table.Table;
376
- }
377
- });
378
- Object.defineProperty(exports, "TableCell", {
379
- enumerable: true,
380
- get: function () {
381
- return _Table.TableCell;
382
- }
383
- });
384
- Object.defineProperty(exports, "TableHeader", {
385
- enumerable: true,
386
- get: function () {
387
- return _Table.TableHeader;
388
- }
389
- });
390
- Object.defineProperty(exports, "TablePaginator", {
391
- enumerable: true,
392
- get: function () {
393
- return _Table.TablePaginator;
394
- }
395
- });
396
- Object.defineProperty(exports, "TableRow", {
397
- enumerable: true,
398
- get: function () {
399
- return _Table.TableRow;
400
- }
401
- });
402
- Object.defineProperty(exports, "TableTitle", {
403
- enumerable: true,
404
- get: function () {
405
- return _Table.TableTitle;
406
- }
407
- });
408
372
  Object.defineProperty(exports, "TextField", {
409
373
  enumerable: true,
410
374
  get: function () {
@@ -512,8 +476,6 @@ var _Layout = require("./components/Layout");
512
476
 
513
477
  var _index = require("./components/RadioButton/index");
514
478
 
515
- var _Table = require("./components/Table");
516
-
517
479
  var _CardBlock = _interopRequireDefault(require("./components/CardBlock"));
518
480
 
519
481
  var _CardContainer = _interopRequireDefault(require("./components/CardContainer"));
@@ -18,6 +18,12 @@ const SEED_DATA_PROPS = {
18
18
  required: true,
19
19
  group: _types.GROUPS.data
20
20
  },
21
+ labelSize: (0, _types.createNumberProp)({
22
+ label: "Label Size"
23
+ }),
24
+ labelColor: (0, _types.createColorProp)({
25
+ label: "Label Color"
26
+ }),
21
27
  mode: {
22
28
  label: "Mode",
23
29
  description: "Choose between date, time and datetime",
@@ -29,6 +35,12 @@ const SEED_DATA_PROPS = {
29
35
  options: ["date", "time", "datetime"],
30
36
  group: _types.GROUPS.basic
31
37
  },
38
+ borderColor: (0, _types.createColorProp)({
39
+ label: "Border Color"
40
+ }),
41
+ borderColorActive: (0, _types.createColorProp)({
42
+ label: "Border Color"
43
+ }),
32
44
  format: {
33
45
  label: "Format",
34
46
  description: "Create an output format for the date.",
@@ -145,6 +157,7 @@ const SEED_DATA = [{
145
157
  category: _types.COMPONENT_TYPES.input,
146
158
  layout: null,
147
159
  triggers: [_types.Triggers.OnDateChange],
160
+ StylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Size, _types.StylesPanelSections.Typography],
148
161
  props: { ...SEED_DATA_PROPS,
149
162
  type: {
150
163
  label: "Appearance",
@@ -12,7 +12,7 @@ const SEED_DATA = [{
12
12
  tag: "Stepper",
13
13
  description: "A component used to control the quantity of something",
14
14
  category: _types.COMPONENT_TYPES.control,
15
- stylesPanelSections: _types.BLOCK_STYLES_SECTIONS,
15
+ stylesPanelSections: [_types.StylesPanelSections.Typography, ..._types.BLOCK_STYLES_SECTIONS],
16
16
  layout: {},
17
17
  triggers: [_types.Triggers.OnChange],
18
18
  props: {
@@ -24,7 +24,7 @@ const SEED_DATA_PROPS = {
24
24
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
25
25
  editable: true,
26
26
  required: false,
27
- defaultValue: null,
27
+ defaultValue: "none",
28
28
  options: ["none", "sentences", "words", "characters"],
29
29
  formType: _types.FORM_TYPES.flatArray,
30
30
  propType: _types.PROP_TYPES.STRING
@@ -103,7 +103,7 @@ const SEED_DATA = [{
103
103
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
104
104
  editable: true,
105
105
  required: false,
106
- defaultValue: null,
106
+ defaultValue: "none",
107
107
  options: ["none", "sentences", "words", "characters"],
108
108
  formType: _types.FORM_TYPES.flatArray,
109
109
  propType: _types.PROP_TYPES.STRING
@@ -44,8 +44,8 @@ function extractStyles(style) {
44
44
  textDecorationStyle
45
45
  };
46
46
  return {
47
- viewStyles: (0, _lodash.omitBy)(viewStyles, _lodash.isNil),
48
- textStyles: (0, _lodash.omitBy)(textStyles, _lodash.isNil)
47
+ viewStyles,
48
+ textStyles
49
49
  };
50
50
  }
51
51
 
@@ -1,3 +1,5 @@
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
+
1
3
  import * as React from "react";
2
4
  import { Pressable, StyleSheet, View } from "react-native";
3
5
  import Text from "../Text";
@@ -18,10 +20,9 @@ const AccordionItem = _ref => {
18
20
  textStyles,
19
21
  viewStyles
20
22
  } = extractStyles(style);
21
- return /*#__PURE__*/React.createElement(Pressable, {
22
- style: [styles.container, viewStyles],
23
- ...rest
24
- }, /*#__PURE__*/React.createElement(View, {
23
+ return /*#__PURE__*/React.createElement(Pressable, _extends({
24
+ style: [styles.container, viewStyles]
25
+ }, rest), /*#__PURE__*/React.createElement(View, {
25
26
  style: styles.row
26
27
  }, icon ? /*#__PURE__*/React.createElement(Icon, {
27
28
  name: icon,
@@ -35,28 +36,6 @@ const AccordionItem = _ref => {
35
36
  }, label))));
36
37
  };
37
38
 
38
- const styles = StyleSheet.create({
39
- container: {
40
- padding: 8
41
- },
42
- row: {
43
- flexDirection: "row",
44
- alignItems: "center",
45
- paddingLeft: 8
46
- },
47
- item: {
48
- marginVertical: 6,
49
- paddingLeft: 8
50
- },
51
- content: {
52
- flex: 1,
53
- justifyContent: "center"
54
- }
55
- });
56
- export default withTheme(AccordionItem);xtStyles
57
- }, label))));
58
- };
59
-
60
39
  const styles = StyleSheet.create({
61
40
  container: {
62
41
  padding: 8
@@ -1,3 +1,5 @@
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
+
1
3
  import * as React from "react";
2
4
  import { View, Animated, Text, StyleSheet, I18nManager, TextInput as NativeTextInput } from "react-native";
3
5
  import { useSafeAreaInsets } from "react-native-safe-area-context";
@@ -6,6 +8,7 @@ import { withTheme } from "../../theming";
6
8
  import Portal from "../Portal/Portal";
7
9
  import Touchable from "../Touchable";
8
10
  import DateTimePicker from "./DatePickerComponent";
11
+ import { extractStyles } from "../../utilities";
9
12
  const AnimatedText = Animated.createAnimatedComponent(Text);
10
13
  const FOCUS_ANIMATION_DURATION = 150;
11
14
  const BLUR_ANIMATION_DURATION = 180;
@@ -33,7 +36,11 @@ const DatePicker = _ref => {
33
36
  rightIconName,
34
37
  leftIconMode = "inset",
35
38
  label,
39
+ labelSize,
40
+ labelColor,
36
41
  placeholder,
42
+ borderColor: inputBorderColor,
43
+ borderColorActive: inputBorderColorActive,
37
44
  ...props
38
45
  } = _ref;
39
46
  const [value, setValue] = React.useState(date || defaultValue);
@@ -50,6 +57,9 @@ const DatePicker = _ref => {
50
57
  measured: false,
51
58
  width: 0
52
59
  });
60
+ const {
61
+ textStyles
62
+ } = extractStyles(style);
53
63
 
54
64
  const getValidDate = () => {
55
65
  if (!value) {
@@ -151,8 +161,8 @@ const DatePicker = _ref => {
151
161
 
152
162
  const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
153
163
  const OUTLINE_MINIMIZED_LABEL_Y_OFFSET = -(16 * 0.5 + 4);
154
- const MAXIMIZED_LABEL_FONT_SIZE = typography.subtitle1.fontSize;
155
- const MINIMIZED_LABEL_FONT_SIZE = typography.caption.fontSize;
164
+ const MAXIMIZED_LABEL_FONT_SIZE = (textStyles === null || textStyles === void 0 ? void 0 : textStyles.fontSize) || typography.subtitle1.fontSize;
165
+ const MINIMIZED_LABEL_FONT_SIZE = labelSize ? labelSize : typography.caption.fontSize;
156
166
  const hasActiveOutline = focused;
157
167
  let inputTextColor, activeColor, underlineColor, borderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
158
168
  inputTextColor = colors.strong;
@@ -164,9 +174,9 @@ const DatePicker = _ref => {
164
174
  underlineColor = "transparent";
165
175
  backgroundColor = colors.divider;
166
176
  } else {
167
- activeColor = colors.primary;
168
- placeholderColor = borderColor = colors.light;
169
- underlineColor = colors.light;
177
+ activeColor = inputBorderColorActive || colors.primary;
178
+ placeholderColor = borderColor = inputBorderColor || colors.light;
179
+ underlineColor = inputBorderColor || colors.light;
170
180
  backgroundColor = colors.background;
171
181
  }
172
182
 
@@ -226,6 +236,7 @@ const DatePicker = _ref => {
226
236
  };
227
237
  const labelStyle = { ...typography.subtitle1,
228
238
  top: type === "solid" ? 16 : 0,
239
+ fontFamily: textStyles === null || textStyles === void 0 ? void 0 : textStyles.fontFamily,
229
240
  left: leftIconName && leftIconMode === "inset" ? ICON_SIZE + (type === "solid" ? 16 : 12) : 0,
230
241
  transform: [{
231
242
  // Move label to top
@@ -249,7 +260,7 @@ const DatePicker = _ref => {
249
260
  };
250
261
  const inputStyles = [styles.input, inputStyle, type === "solid" ? {
251
262
  marginHorizontal: 12
252
- } : {}]; // const render = (props) => <NativeTextInput {...props} />;
263
+ } : {}, textStyles]; // const render = (props) => <NativeTextInput {...props} />;
253
264
 
254
265
  return /*#__PURE__*/React.createElement(View, {
255
266
  style: [styles.container, style]
@@ -260,9 +271,9 @@ const DatePicker = _ref => {
260
271
  pointerEvents: "none"
261
272
  }, /*#__PURE__*/React.createElement(View, {
262
273
  style: [styles.container, style]
263
- }, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, { ...leftIconProps,
274
+ }, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, _extends({}, leftIconProps, {
264
275
  style: leftIconStyle
265
- }) : null, /*#__PURE__*/React.createElement(View, {
276
+ })) : null, /*#__PURE__*/React.createElement(View, {
266
277
  style: [containerStyle, style ? {
267
278
  height: style.height
268
279
  } : {}]
@@ -295,7 +306,7 @@ const DatePicker = _ref => {
295
306
  style: [styles.placeholder, type === "solid" ? {
296
307
  paddingHorizontal: 12
297
308
  } : {}, labelStyle, {
298
- color: colors.light,
309
+ color: labelColor || colors.light,
299
310
  opacity: labeled.interpolate({
300
311
  inputRange: [0, 1],
301
312
  outputRange: [hasActiveOutline ? 1 : 0, 0]
@@ -306,15 +317,15 @@ const DatePicker = _ref => {
306
317
  style: [styles.placeholder, type === "solid" ? {
307
318
  paddingHorizontal: 12
308
319
  } : {}, labelStyle, {
309
- color: placeholderColor,
320
+ color: labelColor || placeholder,
310
321
  opacity: hasActiveOutline ? labeled : 1
311
322
  }],
312
323
  numberOfLines: 1
313
- }, label)) : null, leftIconName && leftIconMode === "inset" ? /*#__PURE__*/React.createElement(Icon, { ...leftIconProps,
324
+ }, label)) : null, leftIconName && leftIconMode === "inset" ? /*#__PURE__*/React.createElement(Icon, _extends({}, leftIconProps, {
314
325
  style: { ...leftIconStyle,
315
326
  marginLeft: type === "solid" ? 16 : 0
316
327
  }
317
- }) : null, /*#__PURE__*/React.createElement(NativeTextInput, {
328
+ })) : null, /*#__PURE__*/React.createElement(NativeTextInput, _extends({
318
329
  value: formatDate(),
319
330
  placeholder: label ? placeholder1 : placeholder,
320
331
  editable: !disabled,
@@ -323,9 +334,8 @@ const DatePicker = _ref => {
323
334
  onFocus: _handleFocus,
324
335
  onBlur: _handleBlur,
325
336
  underlineColorAndroid: "transparent",
326
- style: inputStyles,
327
- ...props
328
- })), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
337
+ style: inputStyles
338
+ }, props))), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
329
339
  name: rightIconName,
330
340
  size: ICON_SIZE,
331
341
  color: colors.light,
@@ -1,3 +1,5 @@
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
+
1
3
  /* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
2
4
  import React from "react";
3
5
  import { Image as NativeImage, StyleSheet } from "react-native";
@@ -62,24 +64,7 @@ const Image = _ref2 => {
62
64
  height,
63
65
  aspectRatio
64
66
  }]
65
- }, /*#__PURE__*/React.createElement(NativeImage, { ...props,
66
- source: imageSource,
67
- resizeMode: resizeMode,
68
- style: [style, {
69
- height: "100%",
70
- width: "100%"
71
- }]
72
- }));
73
- }
74
-
75
- return /*#__PURE__*/React.createElement(NativeImage, { ...props,
76
- source: source,
77
- resizeMode: resizeMode,
78
- style: style
79
- });
80
- };
81
-
82
- export default Image;ent(NativeImage, _extends({}, props, {
67
+ }, /*#__PURE__*/React.createElement(NativeImage, _extends({}, props, {
83
68
  source: imageSource,
84
69
  resizeMode: resizeMode,
85
70
  style: [style, {
@@ -261,7 +261,6 @@ const Picker = _ref => {
261
261
  );
262
262
  };
263
263
 
264
- export default withTheme(Picker);
265
264
  const styles = StyleSheet.create({
266
265
  marginsContainer: {
267
266
  alignSelf: "stretch",
@@ -331,4 +330,5 @@ const styles = StyleSheet.create({
331
330
  maxWidth: deviceWidth,
332
331
  maxHeight: deviceHeight
333
332
  }
334
- });
333
+ });
334
+ export default withTheme(Picker);
@@ -1,3 +1,5 @@
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
+
1
3
  import * as React from "react";
2
4
  import { View, StyleSheet } from "react-native";
3
5
  import { Picker as NativePicker } from "@react-native-picker/picker";
@@ -8,6 +10,8 @@ import TextField from "../TextField";
8
10
  import Touchable from "../Touchable";
9
11
 
10
12
  const Picker = _ref => {
13
+ var _options$find$label, _options$find;
14
+
11
15
  let {
12
16
  style,
13
17
  options,
@@ -17,9 +21,6 @@ const Picker = _ref => {
17
21
  onValueChange: onValueChangeOverride = () => {},
18
22
  ...props
19
23
  } = _ref;
20
-
21
- var _a, _b;
22
-
23
24
  const {
24
25
  viewStyles: {
25
26
  borderRadius,
@@ -66,7 +67,7 @@ const Picker = _ref => {
66
67
  };
67
68
 
68
69
  const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
69
- const selectedLabel = selectedValue && ((_b = (_a = options.find(o => o.value === selectedValue)) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : selectedValue);
70
+ const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
70
71
  return /*#__PURE__*/React.createElement(Touchable, {
71
72
  disabled: disabled,
72
73
  onPress: toggleFocus,
@@ -89,25 +90,6 @@ const Picker = _ref => {
89
90
  label: o.label,
90
91
  value: o.value,
91
92
  key: o.value
92
- }))), /*#__PURE__*/React.createElement(View, {
93
- pointerEvents: "none"
94
- }, /*#__PURE__*/React.createElement(TextField, { ...props,
95
- value: selectedLabel,
96
- placeholder: placeholder,
97
- // @ts-ignore
98
- ref: textField,
99
- disabled: disabled,
100
- // @ts-expect-error
101
- style: stylesWithoutMargin
102
- }))));
103
- };
104
-
105
- const styles = StyleSheet.create({
106
- container: {
107
- alignSelf: "stretch"
108
- }
109
- });
110
- export default withTheme(Picker); key: o.value
111
93
  }))), /*#__PURE__*/React.createElement(View, {
112
94
  pointerEvents: "none"
113
95
  }, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {