@draftbit/core 46.7.9-cfda7d.2 → 46.7.9-e67976.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 (28) hide show
  1. package/lib/commonjs/components/Accordion/AccordionItem.js +4 -23
  2. package/lib/commonjs/components/AnimatedCircularProgress.js +1 -12
  3. package/lib/commonjs/components/Banner.js +4 -23
  4. package/lib/commonjs/components/Checkbox/context.js +1 -1
  5. package/lib/commonjs/components/CircleImage.js +1 -15
  6. package/lib/commonjs/components/DatePicker/DatePicker.js +8 -1
  7. package/lib/commonjs/components/DeprecatedCardWrapper.js +1 -15
  8. package/lib/commonjs/components/Divider.js +14 -1
  9. package/lib/commonjs/components/Image.js +2 -17
  10. package/lib/commonjs/components/Picker/Picker.js +3 -2
  11. package/lib/commonjs/components/Picker/PickerComponent.ios.js +11 -36
  12. package/lib/commonjs/components/Picker/PickerComponent.web.js +3 -20
  13. package/lib/commonjs/components/ProgressBar.js +7 -37
  14. package/lib/commonjs/components/RadioButton/context.js +1 -1
  15. package/lib/commonjs/constants.js +1 -1
  16. package/lib/commonjs/mappings/DatePicker.js +2 -1
  17. package/lib/module/components/DatePicker/DatePicker.js +8 -1
  18. package/lib/module/components/Picker/Picker.js +3 -2
  19. package/lib/module/mappings/DatePicker.js +2 -1
  20. package/lib/typescript/src/components/Picker/Picker.d.ts.map +1 -1
  21. package/lib/typescript/src/mappings/DatePicker.d.ts.map +1 -1
  22. package/package.json +3 -3
  23. package/src/components/DatePicker/DatePicker.js +1 -1
  24. package/src/components/DatePicker/DatePicker.tsx +1 -1
  25. package/src/components/Picker/Picker.js +2 -1
  26. package/src/components/Picker/Picker.tsx +5 -2
  27. package/src/mappings/DatePicker.js +2 -1
  28. package/src/mappings/DatePicker.ts +2 -1
@@ -12,6 +12,7 @@ var _theming = require("../../theming");
12
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
13
  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); }
14
14
  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; }
15
+ 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); }
15
16
  const AccordionItem = _ref => {
16
17
  let {
17
18
  Icon,
@@ -26,10 +27,9 @@ const AccordionItem = _ref => {
26
27
  textStyles,
27
28
  viewStyles
28
29
  } = (0, _utilities.extractStyles)(style);
29
- return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
30
- style: [styles.container, viewStyles],
31
- ...rest
32
- }, /*#__PURE__*/React.createElement(_reactNative.View, {
30
+ return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
31
+ style: [styles.container, viewStyles]
32
+ }, rest), /*#__PURE__*/React.createElement(_reactNative.View, {
33
33
  style: styles.row
34
34
  }, icon ? /*#__PURE__*/React.createElement(Icon, {
35
35
  name: icon,
@@ -61,23 +61,4 @@ const styles = _reactNative.StyleSheet.create({
61
61
  }
62
62
  });
63
63
  var _default = (0, _theming.withTheme)(AccordionItem);
64
- exports.default = _default;.StyleSheet.create({
65
- container: {
66
- padding: 8
67
- },
68
- row: {
69
- flexDirection: "row",
70
- alignItems: "center",
71
- paddingLeft: 8
72
- },
73
- item: {
74
- marginVertical: 6,
75
- paddingLeft: 8
76
- },
77
- content: {
78
- flex: 1,
79
- justifyContent: "center"
80
- }
81
- });
82
- var _default = (0, _theming.withTheme)(AccordionItem);
83
64
  exports.default = _default;
@@ -10,6 +10,7 @@ var _CircularProgress = _interopRequireDefault(require("./CircularProgress"));
10
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
11
  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); }
12
12
  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; }
13
+ 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); }
13
14
  const AnimatedProgress = _reactNative.Animated.createAnimatedComponent(_CircularProgress.default);
14
15
  const AnimatedCircularProgress = _ref => {
15
16
  let {
@@ -54,18 +55,6 @@ const AnimatedCircularProgress = _ref => {
54
55
  React.useEffect(() => {
55
56
  animate();
56
57
  }, [fill, animate]);
57
- return /*#__PURE__*/React.createElement(AnimatedProgress, {
58
- ...other,
59
- style: other.style,
60
- childrenContainerStyle: other.childrenContainerStyle,
61
- fill: fillAnimation,
62
- tintColor: animateColor()
63
- });
64
- };
65
- var _default = AnimatedCircularProgress;
66
- exports.default = _default;ect(() => {
67
- animate();
68
- }, [fill, animate]);
69
58
  return /*#__PURE__*/React.createElement(AnimatedProgress, _extends({}, other, {
70
59
  style: other.style,
71
60
  childrenContainerStyle: other.childrenContainerStyle,
@@ -12,6 +12,7 @@ var _theming = require("../theming");
12
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
13
  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); }
14
14
  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; }
15
+ 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); }
15
16
  const ELEVATION = 1;
16
17
  const DEFAULT_MAX_WIDTH = 960;
17
18
  const Banner = _ref => {
@@ -69,6 +70,7 @@ const Banner = _ref => {
69
70
  measured: true
70
71
  });
71
72
  };
73
+
72
74
  // The banner animation has 2 parts:
73
75
  // 1. Blank spacer element which animates its height to move the content
74
76
  // 2. Actual banner which animates its translateY
@@ -78,10 +80,9 @@ const Banner = _ref => {
78
80
  // However we can't animated banner's height directly as it'll also resize the content inside
79
81
  const height = _reactNative.Animated.multiply(position, layout.height);
80
82
  const translateY = _reactNative.Animated.multiply(_reactNative.Animated.add(position, -1), layout.height);
81
- return /*#__PURE__*/React.createElement(_Surface.default, {
82
- ...rest,
83
+ return /*#__PURE__*/React.createElement(_Surface.default, _extends({}, rest, {
83
84
  style: [styles.container, (0, _shadow.default)(ELEVATION), style]
84
- }, /*#__PURE__*/React.createElement(_reactNative.View, {
85
+ }), /*#__PURE__*/React.createElement(_reactNative.View, {
85
86
  style: [styles.wrapper, contentStyle]
86
87
  }, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
87
88
  style: {
@@ -163,24 +164,4 @@ const styles = _reactNative.StyleSheet.create({
163
164
  }
164
165
  });
165
166
  var _default = (0, _theming.withTheme)(Banner);
166
- exports.default = _default;",
167
- justifyContent: "flex-start",
168
- marginHorizontal: 8,
169
- marginTop: 16,
170
- marginBottom: 0
171
- },
172
- icon: {
173
- margin: 8
174
- },
175
- message: {
176
- flex: 1,
177
- margin: 8
178
- },
179
- actions: {
180
- flexDirection: "row",
181
- justifyContent: "flex-end",
182
- margin: 8
183
- }
184
- });
185
- var _default = (0, _theming.withTheme)(Banner);
186
167
  exports.default = _default;
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.checkboxGroupContext = exports.Direction = void 0;
7
7
  exports.useCheckboxGroupContext = useCheckboxGroupContext;
8
8
  var _react = require("react");
9
- var Direction;
9
+ let Direction;
10
10
  exports.Direction = Direction;
11
11
  (function (Direction) {
12
12
  Direction["Horizontal"] = "horizontal";
@@ -10,6 +10,7 @@ var _Config = _interopRequireDefault(require("./Config"));
10
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
11
  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); }
12
12
  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; }
13
+ 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); }
13
14
  const CircleImage = _ref => {
14
15
  let {
15
16
  source = _Config.default.placeholderImageURL,
@@ -18,21 +19,6 @@ const CircleImage = _ref => {
18
19
  ...props
19
20
  } = _ref;
20
21
  const borderRadius = size / 2;
21
- return /*#__PURE__*/React.createElement(_reactNative.Image, {
22
- style: [{
23
- width: size,
24
- height: size,
25
- borderRadius
26
- }, style],
27
- source: typeof source === "string" ? {
28
- uri: source
29
- } : source,
30
- resizeMode: "cover",
31
- ...props
32
- });
33
- };
34
- var _default = CircleImage;
35
- exports.default = _default;size / 2;
36
22
  return /*#__PURE__*/React.createElement(_reactNative.Image, _extends({
37
23
  style: [{
38
24
  width: size,
@@ -166,7 +166,14 @@ const DatePicker = _ref => {
166
166
  const MAXIMIZED_LABEL_FONT_SIZE = textStyles.fontSize || typography.subtitle1.fontSize;
167
167
  const MINIMIZED_LABEL_FONT_SIZE = labelSize ? labelSize : typography.caption.fontSize;
168
168
  const hasActiveOutline = focused;
169
- 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;
170
177
  inputTextColor = colors.strong;
171
178
  if (disabled) {
172
179
  activeColor = colors.light;
@@ -8,6 +8,7 @@ var _react = _interopRequireDefault(require("react"));
8
8
  var _theming = require("../theming");
9
9
  var _Touchable = _interopRequireDefault(require("./Touchable"));
10
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+ 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); }
11
12
  const getWidth = numColumns => {
12
13
  switch (numColumns) {
13
14
  case 1:
@@ -27,21 +28,6 @@ const Card = _ref => {
27
28
  ...rest
28
29
  } = _ref;
29
30
  const width = getWidth(numColumns);
30
- return /*#__PURE__*/_react.default.createElement(_Touchable.default, {
31
- disabled: !onPress,
32
- onPress: onPress,
33
- style: [style, {
34
- width
35
- }],
36
- ...rest
37
- }, children);
38
- };
39
- var _default = (0, _theming.withTheme)(Card);
40
- exports.default = _default;s,
41
- style,
42
- ...rest
43
- } = _ref;
44
- const width = getWidth(numColumns);
45
31
  return /*#__PURE__*/_react.default.createElement(_Touchable.default, _extends({
46
32
  disabled: !onPress,
47
33
  onPress: onPress,
@@ -9,7 +9,6 @@ var _reactNative = require("react-native");
9
9
  var _theming = require("../theming");
10
10
  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); }
11
11
  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; }
12
- 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); }
13
12
  const Divider = _ref => {
14
13
  let {
15
14
  style,
@@ -19,6 +18,20 @@ const Divider = _ref => {
19
18
  },
20
19
  ...rest
21
20
  } = _ref;
21
+ return /*#__PURE__*/React.createElement(_reactNative.View, {
22
+ style: [{
23
+ backgroundColor: color || colors.divider,
24
+ height: _reactNative.StyleSheet.hairlineWidth
25
+ }, style],
26
+ ...rest
27
+ });
28
+ };
29
+ var _default = (0, _theming.withTheme)(Divider);
30
+ exports.default = _default;eme: {
31
+ colors
32
+ },
33
+ ...rest
34
+ } = _ref;
22
35
  return /*#__PURE__*/React.createElement(_reactNative.View, _extends({
23
36
  style: [{
24
37
  backgroundColor: color || colors.divider,
@@ -9,8 +9,7 @@ var _reactNative = require("react-native");
9
9
  var _Config = _interopRequireDefault(require("./Config"));
10
10
  var _AspectRatio = _interopRequireDefault(require("./AspectRatio"));
11
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
- /* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
13
-
12
+ 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); }
14
13
  const generateDimensions = _ref => {
15
14
  let {
16
15
  aspectRatio,
@@ -63,27 +62,13 @@ const Image = _ref2 => {
63
62
  height,
64
63
  aspectRatio
65
64
  }]
66
- }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
67
- ...props,
65
+ }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, _extends({}, props, {
68
66
  source: imageSource,
69
67
  resizeMode: resizeMode,
70
68
  style: [style, {
71
69
  height: "100%",
72
70
  width: "100%"
73
71
  }]
74
- }));
75
- }
76
- return /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
77
- ...props,
78
- source: source,
79
- resizeMode: resizeMode,
80
- style: style
81
- });
82
- };
83
- var _default = Image;
84
- exports.default = _default; "100%",
85
- width: "100%"
86
- }]
87
72
  })));
88
73
  }
89
74
  return /*#__PURE__*/_react.default.createElement(_reactNative.Image, _extends({}, props, {
@@ -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)";
@@ -239,8 +240,8 @@ const Picker = _ref => {
239
240
  label: option.label,
240
241
  value: option.value,
241
242
  key: option.value
242
- })))))) : null, !isIos && pickerVisible ? /*#__PURE__*/React.createElement(_picker.Picker, {
243
- enabled: pickerVisible,
243
+ })))))) : null, !isIos && (pickerVisible || isWeb) ? /*#__PURE__*/React.createElement(_picker.Picker, {
244
+ enabled: !disabled,
244
245
  selectedValue: internalValue,
245
246
  onValueChange: handleValueChange,
246
247
  style: styles.nonIosPicker,
@@ -18,7 +18,9 @@ var _utilities = require("../../utilities");
18
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
19
  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); }
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
+ 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); }
21
22
  const Picker = _ref => {
23
+ var _options$find$label, _options$find;
22
24
  let {
23
25
  Icon,
24
26
  style,
@@ -32,7 +34,6 @@ const Picker = _ref => {
32
34
  },
33
35
  ...props
34
36
  } = _ref;
35
- var _a, _b;
36
37
  const {
37
38
  viewStyles: {
38
39
  borderRadius,
@@ -73,24 +74,26 @@ const Picker = _ref => {
73
74
  };
74
75
 
75
76
  const stylesWithoutMargin = style && (0, _lodash.default)(_reactNative.StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
76
- 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);
77
+ 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);
77
78
  return /*#__PURE__*/React.createElement(_reactNative.View, {
78
79
  style: [styles.container, viewStyles]
79
80
  }, /*#__PURE__*/React.createElement(_Touchable.default, {
80
81
  disabled: disabled,
81
82
  onPress: toggleVisibility
82
- }, /*#__PURE__*/React.createElement(_TextField.default, {
83
- ...props,
83
+ }, /*#__PURE__*/React.createElement(_TextField.default, _extends({}, props, {
84
84
  value: String(selectedLabel),
85
- placeholder: placeholder,
85
+ placeholder: placeholder
86
86
  // @ts-ignore
87
- ref: textField,
87
+ ,
88
+ ref: textField // cannot determine if ref is of correct type due to component being wrapped in a withTheme()
89
+ ,
88
90
  disabled: disabled,
89
- pointerEvents: "none",
91
+ pointerEvents: "none"
90
92
  // @ts-expect-error
93
+ ,
91
94
  style: stylesWithoutMargin,
92
95
  Icon: Icon
93
- })), pickerVisible && /*#__PURE__*/React.createElement(_Portal.default, null, /*#__PURE__*/React.createElement(_reactNative.View, {
96
+ }))), pickerVisible && /*#__PURE__*/React.createElement(_Portal.default, null, /*#__PURE__*/React.createElement(_reactNative.View, {
94
97
  style: [styles.picker, {
95
98
  backgroundColor: colors.divider
96
99
  }]
@@ -135,32 +138,4 @@ const styles = _reactNative.StyleSheet.create({
135
138
  }
136
139
  });
137
140
  var _default = (0, _theming.withTheme)(Picker);
138
- exports.default = _default;ateElement(_picker.Picker.Item, {
139
- label: o.label,
140
- value: o.value,
141
- key: o.value
142
- })))))));
143
- };
144
- const styles = _reactNative.StyleSheet.create({
145
- container: {
146
- alignSelf: "stretch"
147
- },
148
- picker: {
149
- position: "absolute",
150
- bottom: 0,
151
- left: 0,
152
- right: 0,
153
- flexDirection: "row",
154
- justifyContent: "center"
155
- },
156
- pickerContainer: {
157
- backgroundColor: "white",
158
- flexDirection: "column",
159
- width: "100%"
160
- },
161
- closeButton: {
162
- alignSelf: "flex-end"
163
- }
164
- });
165
- var _default = (0, _theming.withTheme)(Picker);
166
141
  exports.default = _default;
@@ -15,7 +15,9 @@ var _Touchable = _interopRequireDefault(require("../Touchable"));
15
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
16
  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); }
17
17
  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; }
18
+ 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); }
18
19
  const Picker = _ref => {
20
+ var _options$find$label, _options$find;
19
21
  let {
20
22
  style,
21
23
  options,
@@ -25,7 +27,6 @@ const Picker = _ref => {
25
27
  onValueChange: onValueChangeOverride = () => {},
26
28
  ...props
27
29
  } = _ref;
28
- var _a, _b;
29
30
  const {
30
31
  viewStyles: {
31
32
  borderRadius,
@@ -70,7 +71,7 @@ const Picker = _ref => {
70
71
  };
71
72
 
72
73
  const stylesWithoutMargin = style && (0, _lodash.default)(_reactNative.StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
73
- 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);
74
+ 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);
74
75
  return /*#__PURE__*/React.createElement(_Touchable.default, {
75
76
  disabled: disabled,
76
77
  onPress: toggleFocus,
@@ -95,24 +96,6 @@ const Picker = _ref => {
95
96
  key: o.value
96
97
  }))), /*#__PURE__*/React.createElement(_reactNative.View, {
97
98
  pointerEvents: "none"
98
- }, /*#__PURE__*/React.createElement(_TextField.default, {
99
- ...props,
100
- value: selectedLabel,
101
- placeholder: placeholder,
102
- // @ts-ignore
103
- ref: textField,
104
- disabled: disabled,
105
- // @ts-expect-error
106
- style: stylesWithoutMargin
107
- }))));
108
- };
109
- const styles = _reactNative.StyleSheet.create({
110
- container: {
111
- alignSelf: "stretch"
112
- }
113
- });
114
- var _default = (0, _theming.withTheme)(Picker);
115
- exports.default = _default;pointerEvents: "none"
116
99
  }, /*#__PURE__*/React.createElement(_TextField.default, _extends({}, props, {
117
100
  value: selectedLabel,
118
101
  placeholder: placeholder
@@ -8,12 +8,16 @@ var _react = _interopRequireWildcard(require("react"));
8
8
  var _reactNative = require("react-native");
9
9
  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); }
10
10
  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; }
11
+ 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); }
12
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
13
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
14
+ function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
11
15
  const INDETERMINATE_WIDTH_FACTOR = 0.3;
12
16
  const BAR_WIDTH_ZERO_POSITION = INDETERMINATE_WIDTH_FACTOR / (1 + INDETERMINATE_WIDTH_FACTOR);
13
17
  class ProgressBar extends _react.Component {
14
18
  constructor(props) {
15
19
  super(props);
16
- this.handleLayout = event => {
20
+ _defineProperty(this, "handleLayout", event => {
17
21
  const {
18
22
  width = 150,
19
23
  onLayout
@@ -26,7 +30,7 @@ class ProgressBar extends _react.Component {
26
30
  if (onLayout) {
27
31
  onLayout(event);
28
32
  }
29
- };
33
+ });
30
34
  const {
31
35
  progress: progressP = 0,
32
36
  indeterminate = false
@@ -74,6 +78,7 @@ class ProgressBar extends _react.Component {
74
78
  ...animationConfig,
75
79
  toValue: progress,
76
80
  velocity: 0,
81
+ //adjust this value if animation fails - velocity is required
77
82
  useNativeDriver
78
83
  }).start();
79
84
  } else {
@@ -142,41 +147,6 @@ class ProgressBar extends _react.Component {
142
147
  })
143
148
  }]
144
149
  };
145
- return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
146
- style: [containerStyle, style],
147
- onLayout: this.handleLayout,
148
- ...restProps
149
- }, /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
150
- style: progressStyle
151
- }), children);
152
- }
153
- }
154
- exports.default = ProgressBar;,
155
- overflow: "hidden",
156
- backgroundColor: unfilledColor
157
- };
158
- const progressStyle = {
159
- backgroundColor: color,
160
- // Always take up full height of container.
161
- height: "100%",
162
- transform: [{
163
- translateX: this.state.animationValue.interpolate({
164
- inputRange: [0, 1],
165
- outputRange: [innerWidth * -INDETERMINATE_WIDTH_FACTOR, innerWidth]
166
- })
167
- }, {
168
- translateX: this.state.progress.interpolate({
169
- inputRange: [0, 1],
170
- outputRange: [innerWidth / (_reactNative.I18nManager.isRTL ? 2 : -2), 0]
171
- })
172
- }, {
173
- // Interpolation a temp workaround for https://github.com/facebook/react-native/issues/6278
174
- scaleX: this.state.progress.interpolate({
175
- inputRange: [0, 1],
176
- outputRange: [0.0001, 1]
177
- })
178
- }]
179
- };
180
150
  return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
181
151
  style: [containerStyle, style],
182
152
  onLayout: this.handleLayout
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.radioButtonGroupContext = exports.Direction = void 0;
7
7
  exports.useRadioButtonGroupContext = useRadioButtonGroupContext;
8
8
  var _react = require("react");
9
- var Direction;
9
+ let Direction;
10
10
  exports.Direction = Direction;
11
11
  (function (Direction) {
12
12
  Direction["Horizontal"] = "horizontal";
@@ -12,4 +12,4 @@ const APPROX_STATUSBAR_HEIGHT = _reactNative.Platform.select({
12
12
  android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
13
13
  ios: _reactNative.Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
14
14
  });
15
- exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;AR_HEIGHT;
15
+ exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;
@@ -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",
@@ -157,7 +157,14 @@ const DatePicker = _ref => {
157
157
  const MAXIMIZED_LABEL_FONT_SIZE = textStyles.fontSize || typography.subtitle1.fontSize;
158
158
  const MINIMIZED_LABEL_FONT_SIZE = labelSize ? labelSize : typography.caption.fontSize;
159
159
  const hasActiveOutline = focused;
160
- 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;
161
168
  inputTextColor = colors.strong;
162
169
  if (disabled) {
163
170
  activeColor = colors.light;
@@ -33,6 +33,7 @@ const {
33
33
  height: deviceHeight
34
34
  } = Dimensions.get("screen");
35
35
  const isIos = Platform.OS === "ios";
36
+ const isWeb = Platform.OS === "web";
36
37
  const unstyledColor = "rgba(165, 173, 183, 1)";
37
38
  const disabledColor = "rgb(240, 240, 240)";
38
39
  const errorColor = "rgba(255, 69, 100, 1)";
@@ -230,8 +231,8 @@ const Picker = _ref => {
230
231
  label: option.label,
231
232
  value: option.value,
232
233
  key: option.value
233
- })))))) : null, !isIos && pickerVisible ? /*#__PURE__*/React.createElement(NativePicker, {
234
- enabled: pickerVisible,
234
+ })))))) : null, !isIos && (pickerVisible || isWeb) ? /*#__PURE__*/React.createElement(NativePicker, {
235
+ enabled: !disabled,
235
236
  selectedValue: internalValue,
236
237
  onValueChange: handleValueChange,
237
238
  style: styles.nonIosPicker,
@@ -31,7 +31,8 @@ const SEED_DATA_PROPS = {
31
31
  label: "Border Color"
32
32
  }),
33
33
  borderColorActive: createColorProp({
34
- label: "Border Color"
34
+ label: "Active Border Color",
35
+ description: "Color of border when date picker is active"
35
36
  }),
36
37
  format: {
37
38
  label: "Format",
@@ -1 +1 @@
1
- {"version":3,"file":"Picker.d.ts","sourceRoot":"","sources":["../../../../../src/components/Picker/Picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,SAAS,EACT,SAAS,EAGV,MAAM,cAAc,CAAC;AAStB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAQtD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,oBAAY,WAAW,GAAG;IACxB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG;QAAE,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,YAAY,EAAE,GAAG,MAAM,EAAE,CAAC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;CACxB,CAAC;;;;AAwaF,wBAAiC"}
1
+ {"version":3,"file":"Picker.d.ts","sourceRoot":"","sources":["../../../../../src/components/Picker/Picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,SAAS,EACT,SAAS,EAGV,MAAM,cAAc,CAAC;AAStB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAQtD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,oBAAY,WAAW,GAAG;IACxB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG;QAAE,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,YAAY,EAAE,GAAG,MAAM,EAAE,CAAC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;CACxB,CAAC;;;;AA2aF,wBAAiC"}
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../src/mappings/DatePicker.ts"],"names":[],"mappings":"AAgKA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCrB,CAAC"}
1
+ {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../src/mappings/DatePicker.ts"],"names":[],"mappings":"AAiKA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCrB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "46.7.9-cfda7d.2+cfda7de",
3
+ "version": "46.7.9-e67976.2+e679764",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -41,7 +41,7 @@
41
41
  "dependencies": {
42
42
  "@date-io/date-fns": "^1.3.13",
43
43
  "@draftbit/react-theme-provider": "^2.1.1",
44
- "@draftbit/types": "^46.7.9-cfda7d.2+cfda7de",
44
+ "@draftbit/types": "^46.7.9-e67976.2+e679764",
45
45
  "@material-ui/core": "^4.11.0",
46
46
  "@material-ui/pickers": "^3.2.10",
47
47
  "@react-native-community/slider": "4.2.3",
@@ -91,5 +91,5 @@
91
91
  ]
92
92
  ]
93
93
  },
94
- "gitHead": "cfda7def27e7e26316caa2a8e606a558656b1559"
94
+ "gitHead": "e679764813b38f028b6898d27fd6b2c967634c9b"
95
95
  }
@@ -137,7 +137,7 @@ const DatePicker = ({ Icon, style, theme: { colors, typography, roundness, disab
137
137
  ? labelSize
138
138
  : typography.caption.fontSize;
139
139
  const hasActiveOutline = focused;
140
- let inputTextColor, activeColor, underlineColor, borderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
140
+ let inputTextColor, activeColor, underlineColor, borderColor = inputBorderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
141
141
  inputTextColor = colors.strong;
142
142
  if (disabled) {
143
143
  activeColor = colors.light;
@@ -241,7 +241,7 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
241
241
  let inputTextColor,
242
242
  activeColor,
243
243
  underlineColor,
244
- borderColor,
244
+ borderColor = inputBorderColor,
245
245
  placeholderColor,
246
246
  containerStyle: StyleProp<ViewStyle>,
247
247
  backgroundColor,
@@ -32,6 +32,7 @@ function normalizeOptions(options) {
32
32
  }
33
33
  const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
34
34
  const isIos = Platform.OS === "ios";
35
+ const isWeb = Platform.OS === "web";
35
36
  const unstyledColor = "rgba(165, 173, 183, 1)";
36
37
  const disabledColor = "rgb(240, 240, 240)";
37
38
  const errorColor = "rgba(255, 69, 100, 1)";
@@ -191,7 +192,7 @@ const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style,
191
192
  React.createElement(View, { style: styles.iosPickerContent },
192
193
  React.createElement(Button, { Icon: Icon, type: "text", onPress: togglePickerVisible, style: styles.iosButton }, "Close"),
193
194
  React.createElement(NativePicker, { style: styles.iosNativePicker, selectedValue: internalValue, onValueChange: handleValueChange }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value })))))))) : null,
194
- !isIos && pickerVisible ? (React.createElement(NativePicker, { enabled: pickerVisible, selectedValue: internalValue, onValueChange: handleValueChange, style: styles.nonIosPicker, ref: androidPickerRef, onBlur: () => setPickerVisible(false) }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value }))))) : null));
195
+ !isIos && (pickerVisible || isWeb) ? (React.createElement(NativePicker, { enabled: !disabled, selectedValue: internalValue, onValueChange: handleValueChange, style: styles.nonIosPicker, ref: androidPickerRef, onBlur: () => setPickerVisible(false) }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value }))))) : null));
195
196
  };
196
197
  const styles = StyleSheet.create({
197
198
  marginsContainer: {
@@ -86,6 +86,8 @@ function normalizeOptions(options: PickerProps["options"]): PickerOption[] {
86
86
 
87
87
  const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
88
88
  const isIos = Platform.OS === "ios";
89
+ const isWeb = Platform.OS === "web";
90
+
89
91
  const unstyledColor = "rgba(165, 173, 183, 1)";
90
92
  const disabledColor = "rgb(240, 240, 240)";
91
93
  const errorColor = "rgba(255, 69, 100, 1)";
@@ -383,9 +385,10 @@ const Picker: React.FC<PickerProps> = ({
383
385
  ) : null}
384
386
 
385
387
  {/* nonIosPicker */}
386
- {!isIos && pickerVisible ? (
388
+ {/* Web version is collapsed by default, always show to allow direct expand */}
389
+ {!isIos && (pickerVisible || isWeb) ? (
387
390
  <NativePicker
388
- enabled={pickerVisible}
391
+ enabled={!disabled}
389
392
  selectedValue={internalValue}
390
393
  onValueChange={handleValueChange}
391
394
  style={styles.nonIosPicker}
@@ -31,7 +31,8 @@ const SEED_DATA_PROPS = {
31
31
  label: "Border Color",
32
32
  }),
33
33
  borderColorActive: createColorProp({
34
- label: "Border Color",
34
+ label: "Active Border Color",
35
+ description: "Color of border when date picker is active",
35
36
  }),
36
37
  format: {
37
38
  label: "Format",
@@ -43,7 +43,8 @@ const SEED_DATA_PROPS = {
43
43
  label: "Border Color",
44
44
  }),
45
45
  borderColorActive: createColorProp({
46
- label: "Border Color",
46
+ label: "Active Border Color",
47
+ description: "Color of border when date picker is active",
47
48
  }),
48
49
  format: {
49
50
  label: "Format",