@draftbit/core 46.5.2-404403.2 → 46.5.2-5f6e91.0

package/lib/commonjs/components/Switch.js

@@ -13,7 +13,6 @@ var _hooks = require("../hooks");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 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; }
-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); }
 function Switch(_ref) {
   let {
     value,
@@ -38,7 +37,6 @@ function Switch(_ref) {
       setChecked(value);
     }
   }, [value, checked]);
-
   // This special logic is to handle weird APIs like Airtable that return
   // true or undefined for a boolean
   const previousDefaultValue = (0, _hooks.usePrevious)(defaultValue);
@@ -47,24 +45,24 @@ function Switch(_ref) {
       setChecked(Boolean(defaultValue));
     }
   }, [defaultValue, previousDefaultValue]);
-  return /*#__PURE__*/React.createElement(_reactNative.Switch, _extends({
+  return /*#__PURE__*/React.createElement(_reactNative.Switch, {
     value: checked,
     disabled: disabled,
     trackColor: {
       false: inactiveTrackThemeColor,
       true: activeTrackThemeColor
     },
-    thumbColor: value ? activeThumbThemeColor : inactiveThumbThemeColor
+    thumbColor: value ? activeThumbThemeColor : inactiveThumbThemeColor,
     // @ts-ignore react-native-web only
-    ,
     activeThumbColor: activeThumbThemeColor,
     ios_backgroundColor: inactiveTrackThemeColor,
     style: style,
     onValueChange: bool => {
       setChecked(bool);
       onValueChange && onValueChange(bool);
-    }
-  }, rest));
+    },
+    ...rest
+  });
 }
 function Row(_ref2) {
   let {
@@ -93,7 +91,7 @@ function Row(_ref2) {
       setChecked(defaultValue);
     }
   }, [defaultValue]);
-  return /*#__PURE__*/React.createElement(_FormRow.default, _extends({
+  return /*#__PURE__*/React.createElement(_FormRow.default, {
     disabled: disabled,
     onPress: () => {
       setChecked(!checked);
@@ -101,8 +99,9 @@ function Row(_ref2) {
     },
     label: label,
     direction: direction,
-    style: style
-  }, rest), /*#__PURE__*/React.createElement(Switch, {
+    style: style,
+    ...rest
+  }, /*#__PURE__*/React.createElement(Switch, {
     theme: theme,
     value: checked,
     disabled: disabled,
@@ -116,4 +115,14 @@ function Row(_ref2) {
 const SwitchRow = (0, _theming.withTheme)(Row);
 exports.SwitchRow = SwitchRow;
 var _default = (0, _theming.withTheme)(Switch);
+exports.default = _default;hange: onValueChange,
+    activeTrackColor: activeTrackColor,
+    inactiveTrackColor: inactiveTrackColor,
+    activeThumbColor: activeThumbColor,
+    inactiveThumbColor: inactiveThumbColor
+  }));
+}
+const SwitchRow = (0, _theming.withTheme)(Row);
+exports.SwitchRow = SwitchRow;
+var _default = (0, _theming.withTheme)(Switch);
 exports.default = _default;

package/lib/commonjs/components/Text.js

@@ -9,10 +9,56 @@ var _reactNative = require("react-native");
 var _theming = require("../theming");
 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); }
 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; }
-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); }
-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; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-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); }
+class Text extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.state = {
+      nativeProps: {}
+    };
+  }
+  setNativeProps(args) {
+    this.state.nativeProps = args || {};
+  }
+  render() {
+    const {
+      style,
+      ...rest
+    } = this.props;
+    const writingDirection = _reactNative.I18nManager.isRTL ? "rtl" : "ltr";
+    return /*#__PURE__*/React.createElement(_reactNative.Text, {
+      ...rest,
+      ...this.state.nativeProps,
+      ref: c => {
+        this._root = c;
+      },
+      style: [{
+        textAlign: "left",
+        writingDirection
+      }, style]
+    });
+  }
+}
+const BaseLink = _ref => {
+  let {
+    style,
+    theme,
+    title,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Text, {
+    hitSlop: 8,
+    style: [{
+      color: theme.colors.primary
+    }, style],
+    theme: theme,
+    ...props
+  }, title);
+};
+exports.BaseLink = BaseLink;
+const Link = (0, _theming.withTheme)(BaseLink);
+exports.Link = Link;
+var _default = (0, _theming.withTheme)(Text);
+exports.default = _default;tring : Number)(input); }
 class Text extends React.Component {
   constructor() {
     super(...arguments);

package/lib/commonjs/components/Touchable.js

@@ -7,7 +7,6 @@ exports.default = Touchable;
 var _react = _interopRequireDefault(require("react"));
 var _reactNative = require("react-native");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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); }
 function Touchable(_ref) {
   let {
     children,
@@ -16,6 +15,22 @@ function Touchable(_ref) {
     style,
     ...props
   } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
+    onPress: onPress,
+    disabled: disabled,
+    hitSlop: 8,
+    style: _ref2 => {
+      let {
+        pressed
+      } = _ref2;
+      return [{
+        opacity: pressed || disabled ? 0.75 : 1
+      }, style];
+    },
+    ...props
+  }, children);
+}ops
+  } = _ref;
   return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
     onPress: onPress,
     disabled: disabled,

package/lib/commonjs/hooks.js

@@ -10,12 +10,11 @@ function usePrevious(value) {
   // The ref object is a generic container whose current property is mutable
   // and can hold any value, similar to an instance property on a class
   const ref = _react.default.useRef();
-
   // Store current value in ref
   _react.default.useEffect(() => {
     ref.current = value;
   }, [value]);
-
   // Return previous value (happens before update in useEffect above)
   return ref.current;
+}
 }

package/lib/commonjs/styles/overlay.js

@@ -15,7 +15,6 @@ function overlay(elevation) {
   let surfaceColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _DarkTheme.default.colors.surface;
   if (isAnimatedValue(elevation)) {
     const inputRange = [0, 1, 2, 3, 8, 24];
-
     // @ts-expect-error: TS doesn't seem to refine the type correctly
     return elevation.interpolate({
       inputRange,
@@ -24,7 +23,6 @@ function overlay(elevation) {
       })
     });
   }
-
   // @ts-expect-error: TS doesn't seem to refine the type correctly
   return calculateColor(surfaceColor, elevation);
 }
@@ -65,4 +63,4 @@ const elevationOverlayTransparency = {
   22: 15.72,
   23: 15.84,
   24: 16
-};
+};};

package/lib/module/components/AnimatedCircularProgress.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { Animated, Easing } from "react-native";
 import CircularProgress from "./CircularProgress";
@@ -46,6 +45,19 @@ const AnimatedCircularProgress = _ref => {
   React.useEffect(() => {
     animate();
   }, [fill, animate]);
+  return /*#__PURE__*/React.createElement(AnimatedProgress, {
+    ...other,
+    style: other.style,
+    childrenContainerStyle: other.childrenContainerStyle,
+    fill: fillAnimation,
+    tintColor: animateColor()
+  });
+};
+export default AnimatedCircularProgress;imation;
+  };
+  React.useEffect(() => {
+    animate();
+  }, [fill, animate]);
   return /*#__PURE__*/React.createElement(AnimatedProgress, _extends({}, other, {
     style: other.style,
     childrenContainerStyle: other.childrenContainerStyle,

package/lib/module/components/CardContainer.js

@@ -1,4 +1,3 @@
-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); }
 import React from "react";
 import { View, Text } from "react-native";
 import color from "color";
@@ -45,11 +44,12 @@ const CardContainer = _ref => {
       titleStyle = typography.headline5;
       break;
   }
-  return /*#__PURE__*/React.createElement(Card, _extends({
+  return /*#__PURE__*/React.createElement(Card, {
     style: style,
     onPress: onPress,
-    numColumns: numColumns
-  }, rest), /*#__PURE__*/React.createElement(Elevation, {
+    numColumns: numColumns,
+    ...rest
+  }, /*#__PURE__*/React.createElement(Elevation, {
     style: {
       elevation,
       borderRadius: roundness
@@ -118,4 +118,14 @@ const CardContainer = _ref => {
     color: colors.surface
   })) : null)));
 };
+export default withTheme(CardContainer);ONTAINER_PADDING,
+      borderRadius: ICON_CONTAINER_SIZE,
+      backgroundColor: color(colors.strong).alpha(Config.cardIconBackgroundOpacity).rgb().string()
+    }
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: icon,
+    size: Config.cardIconSize,
+    color: colors.surface
+  })) : null)));
+};
 export default withTheme(CardContainer);

package/lib/module/components/Checkbox/CheckboxGroupRow.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { StyleSheet, View, Platform } from "react-native";
 import Checkbox from "./Checkbox";
@@ -7,7 +6,7 @@ import { useCheckboxGroupContext } from "./context";
 import { Direction as GroupDirection } from "./context";
 import Touchable from "../Touchable";
 import { extractStyles } from "../../utilities";
-export let Direction;
+export var Direction;
 (function (Direction) {
   Direction["Row"] = "row";
   Direction["RowReverse"] = "row-reverse";
@@ -64,13 +63,14 @@ const CheckboxGroupRow = _ref => {
     textStyles,
     viewStyles
   } = extractStyles(style);
-  return /*#__PURE__*/React.createElement(Touchable, _extends({
+  return /*#__PURE__*/React.createElement(Touchable, {
     onPress: handlePress,
     style: [styles.mainParent, {
       flexDirection: direction
     }, viewStyles],
-    disabled: disabled
-  }, rest), /*#__PURE__*/React.createElement(View, {
+    disabled: disabled,
+    ...rest
+  }, /*#__PURE__*/React.createElement(View, {
     style: [styles.label, {
       alignItems: direction === Direction.Row ? "flex-start" : "flex-end"
     }, labelContainerStyle]
@@ -108,4 +108,23 @@ const styles = StyleSheet.create({
     flex: 3
   }
 });
+export default CheckboxGroupRow;reate({
+  mainParent: {
+    alignItems: "center",
+    justifyContent: "space-around",
+    paddingStart: 20,
+    minHeight: 50,
+    paddingEnd: 20,
+    display: "flex",
+    ...Platform.select({
+      web: {
+        cursor: "pointer",
+        userSelect: "none"
+      }
+    })
+  },
+  label: {
+    flex: 3
+  }
+});
 export default CheckboxGroupRow;

package/lib/module/components/Checkbox/CheckboxRow.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { StyleSheet, View, Platform } from "react-native";
 import { isString } from "lodash";
@@ -7,7 +6,7 @@ import { usePrevious } from "../../hooks";
 import Text from "../Text";
 import Touchable from "../Touchable";
 import Checkbox from "./Checkbox";
-export let Direction;
+export var Direction;
 (function (Direction) {
   Direction["Row"] = "row";
   Direction["RowReverse"] = "row-reverse";
@@ -49,7 +48,6 @@ const CheckboxRow = _ref => {
       setInternalValue(status);
     }
   }, [status]);
-
   // This special logic is to handle weird APIs like Airtable that return
   // true or undefined for a boolean
   const previousDefaultValue = usePrevious(defaultValue);
@@ -73,13 +71,14 @@ const CheckboxRow = _ref => {
     textStyles,
     viewStyles
   } = extractStyles(style);
-  return /*#__PURE__*/React.createElement(Touchable, _extends({
+  return /*#__PURE__*/React.createElement(Touchable, {
     onPress: handlePress,
     style: [viewStyles, styles.mainParent, {
       flexDirection: direction
     }],
-    disabled: disabled
-  }, rest), /*#__PURE__*/React.createElement(View, {
+    disabled: disabled,
+    ...rest
+  }, /*#__PURE__*/React.createElement(View, {
     style: [styles.label, {
       alignItems: direction === Direction.Row ? "flex-start" : "flex-end"
     }, labelContainerStyle]
@@ -115,4 +114,23 @@ const styles = StyleSheet.create({
     flex: 3
   }
 });
+export default CheckboxRow;heet.create({
+  mainParent: {
+    alignItems: "center",
+    justifyContent: "space-around",
+    paddingStart: 20,
+    minHeight: 50,
+    paddingEnd: 20,
+    display: "flex",
+    ...Platform.select({
+      web: {
+        cursor: "pointer",
+        userSelect: "none"
+      }
+    })
+  },
+  label: {
+    flex: 3
+  }
+});
 export default CheckboxRow;

package/lib/module/components/Checkbox/context.js

@@ -1,5 +1,5 @@
 import { createContext, useContext } from "react";
-export let Direction;
+export var Direction;
 (function (Direction) {
   Direction["Horizontal"] = "horizontal";
   Direction["Vertical"] = "vertical";

package/lib/module/components/CircleImage.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { Image } from "react-native";
 import Config from "./Config";
@@ -10,6 +9,22 @@ const CircleImage = _ref => {
     ...props
   } = _ref;
   const borderRadius = size / 2;
+  return /*#__PURE__*/React.createElement(Image, {
+    style: [{
+      width: size,
+      height: size,
+      borderRadius
+    }, style],
+    source: typeof source === "string" ? {
+      uri: source
+    } : source,
+    resizeMode: "cover",
+    ...props
+  });
+};
+export default CircleImage;props
+  } = _ref;
+  const borderRadius = size / 2;
   return /*#__PURE__*/React.createElement(Image, _extends({
     style: [{
       width: size,

package/lib/module/components/DatePicker/DatePicker.js

@@ -39,6 +39,8 @@ const DatePicker = _ref => {
     placeholder,
     borderColor: inputBorderColor,
     borderColorActive: inputBorderColorActive,
+    pickerAccentColor,
+    pickerTextColor,
     ...props
   } = _ref;
   const [value, setValue] = React.useState(date || defaultValue);
@@ -341,6 +343,8 @@ const DatePicker = _ref => {
       paddingRight: insets.right
     }]
   }, /*#__PURE__*/React.createElement(DateTimePicker, {
+    accentColor: pickerAccentColor,
+    textColor: pickerTextColor,
     value: getValidDate(),
     mode: mode,
     isVisible: pickerVisible,

package/lib/module/components/DatePicker/DatePickerComponent.js

@@ -6,12 +6,16 @@ const DatePickerComponent = _ref => {
   let {
     value,
     onChange,
+    textColor,
+    accentColor,
     mode,
     toggleVisibility
   } = _ref;
   return Platform.OS === "ios" || Platform.OS === "android" ? /*#__PURE__*/React.createElement(DateTimePickerModal, {
     date: value,
     mode: mode,
+    textColor: textColor,
+    accentColor: accentColor,
     isVisible: true,
     display: Platform.OS === "ios" ? "spinner" : "default",
     onCancel: () => {
@@ -24,6 +28,8 @@ const DatePickerComponent = _ref => {
   }) : /*#__PURE__*/React.createElement(DateTimePicker, {
     value: value,
     mode: mode,
+    textColor: textColor,
+    accentColor: accentColor,
     onChange: onChange,
     display: "default"
   });

package/lib/module/components/DeprecatedFAB.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { ActivityIndicator, View, StyleSheet } from "react-native";
 import color from "color";
@@ -98,7 +97,8 @@ const FAB = _ref => {
     style: [{
       elevation
     }, style]
-  }, /*#__PURE__*/React.createElement(Touchable, _extends({}, rest, {
+  }, /*#__PURE__*/React.createElement(Touchable, {
+    ...rest,
     onPress: onPress,
     accessibilityState: {
       disabled
@@ -106,7 +106,7 @@ const FAB = _ref => {
     accessibilityRole: "button",
     disabled: disabled || loading,
     style: buttonStyles
-  }), /*#__PURE__*/React.createElement(View, {
+  }, /*#__PURE__*/React.createElement(View, {
     style: styles.content
   }, icon && loading !== true ? /*#__PURE__*/React.createElement(View, {
     style: iconStyle
@@ -145,4 +145,24 @@ const styles = StyleSheet.create({
     borderRadius: 0
   }
 });
+export default withTheme(FAB);le: "solid"
+  },
+  content: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  icon: {
+    alignItems: "center",
+    justifyContent: "center",
+    width: Config.buttonIconSize
+  },
+  fixed: {
+    left: 0,
+    right: 0,
+    bottom: 0,
+    height: 64,
+    borderRadius: 0
+  }
+});
 export default withTheme(FAB);

package/lib/module/components/Divider.js

@@ -1,7 +1,24 @@
-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); }
 import * as React from "react";
 import { StyleSheet, View } from "react-native";
 import { withTheme } from "../theming";
+const Divider = _ref => {
+  let {
+    style,
+    color,
+    theme: {
+      colors
+    },
+    ...rest
+  } = _ref;
+  return /*#__PURE__*/React.createElement(View, {
+    style: [{
+      backgroundColor: color || colors.divider,
+      height: StyleSheet.hairlineWidth
+    }, style],
+    ...rest
+  });
+};
+export default withTheme(Divider);ing";
 const Divider = _ref => {
   let {
     style,

package/lib/module/components/Elevation.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { Animated, StyleSheet, View } from "react-native";
 import shadow from "../styles/shadow";
@@ -19,7 +18,20 @@ const Elevation = _ref => {
     colors
   } = theme;
   const borderRadius = radius;
-  return /*#__PURE__*/React.createElement(Animated.View, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(Animated.View, {
+    ...rest,
+    style: [{
+      borderRadius,
+      backgroundColor: colors.surface
+    }, elevation ? shadow(elevation) : null, style]
+  }, /*#__PURE__*/React.createElement(View, {
+    style: {
+      overflow: "hidden",
+      borderRadius
+    }
+  }, children));
+};
+export default withTheme(Elevation);React.createElement(Animated.View, _extends({}, rest, {
     style: [{
       borderRadius,
       backgroundColor: colors.surface

package/lib/module/components/IconButton.js

@@ -1,4 +1,3 @@
-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); }
 import * as React from "react";
 import { View, StyleSheet, ActivityIndicator, Pressable, Platform } from "react-native";
 import { withTheme } from "../theming";
@@ -16,7 +15,7 @@ const IconButton = _ref => {
     ...props
   } = _ref;
   const iconColor = customColor || theme.colors.primary;
-  return /*#__PURE__*/React.createElement(Pressable, _extends({
+  return /*#__PURE__*/React.createElement(Pressable, {
     onPress: onPress,
     disabled: disabled || loading,
     style: _ref2 => {
@@ -30,8 +29,9 @@ const IconButton = _ref => {
         alignItems: "center",
         justifyContent: "center"
       }, style];
-    }
-  }, props), /*#__PURE__*/React.createElement(View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
+    },
+    ...props
+  }, /*#__PURE__*/React.createElement(View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
     name: icon,
     size: size - 2,
     color: iconColor
@@ -52,4 +52,21 @@ const styles = StyleSheet.create({
     })
   }
 });
+export default withTheme(IconButton);ement(ActivityIndicator, {
+    size: "small",
+    color: iconColor
+  }) : null));
+};
+const styles = StyleSheet.create({
+  container: {
+    alignItems: "center",
+    justifyContent: "center",
+    ...Platform.select({
+      web: {
+        cursor: "pointer",
+        userSelect: "none"
+      }
+    })
+  }
+});
 export default withTheme(IconButton);