@draftbit/core 46.4.4-c18fe1.2 → 46.4.4-caab07.0

package/lib/typescript/src/styles/DefaultTheme.d.ts

@@ -1498,4 +1498,5 @@ declare const DefaultTheme: {
     };
 };
 export default DefaultTheme;
-export declare type Theme = typeof DefaultTheme;
+export type Theme = typeof DefaultTheme;
+//# sourceMappingURL=DefaultTheme.d.ts.map

package/lib/typescript/src/styles/DefaultTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultTheme.d.ts","sourceRoot":"","sources":["../../../../src/styles/DefaultTheme.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2GjB,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,MAAM,MAAM,KAAK,GAAG,OAAO,YAAY,CAAC"}

package/lib/typescript/src/styles/fonts.d.ts

@@ -3,3 +3,4 @@ import type { Fonts } from "@draftbit/types";
 export default function configureFonts(config?: {
     [platform in PlatformOSType | "default"]?: Fonts;
 }): Fonts;
+//# sourceMappingURL=fonts.d.ts.map

package/lib/typescript/src/styles/fonts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fonts.d.ts","sourceRoot":"","sources":["../../../../src/styles/fonts.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,cAAc,EAAE,MAAM,cAAc,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AA2D7C,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,MAAM,CAAC,EAAE;KAC7C,QAAQ,IAAI,cAAc,GAAG,SAAS,CAAC,CAAC,EAAE,KAAK;CACjD,GAAG,KAAK,CAGR"}

package/lib/typescript/src/styles/overlay.d.ts

@@ -1,2 +1,3 @@
 import { Animated } from "react-native";
 export default function overlay<T extends Animated.Value | number>(elevation: T, surfaceColor?: string): T extends number ? string : Animated.AnimatedInterpolation;
+//# sourceMappingURL=overlay.d.ts.map

package/lib/typescript/src/styles/overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../../src/styles/overlay.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAOxC,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,CAAC,SAAS,QAAQ,CAAC,KAAK,GAAG,MAAM,EAC/D,SAAS,EAAE,CAAC,EACZ,YAAY,GAAE,MAAiC,GAC9C,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC,qBAAqB,CAe5D"}

package/lib/typescript/src/styles/shadow.d.ts

@@ -21,3 +21,4 @@ export default function shadow(elevation?: number | Animated.Value): {
     shadowOpacity: number;
     shadowRadius: number;
 };
+//# sourceMappingURL=shadow.d.ts.map

package/lib/typescript/src/styles/shadow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shadow.d.ts","sourceRoot":"","sources":["../../../../src/styles/shadow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAKxC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,SAAS,GAAE,MAAM,GAAG,QAAQ,CAAC,KAAS;;;;;;;;;;;;;;;;;;;;;EAiDpE"}

package/lib/typescript/src/theming.d.ts

@@ -6,3 +6,4 @@ export declare const ThemeProvider: import("react").ComponentType<{
 }, C>(WrappedComponent: import("react").ComponentType<Props> & C) => import("react").ComponentType<import("@draftbit/react-theme-provider").$Without<Props, "theme"> & {
     theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
 }> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<import("react").ComponentType<Props> & C, {}>, useTheme: (overrides?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined) => any;
+//# sourceMappingURL=theming.d.ts.map

package/lib/typescript/src/theming.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theming.d.ts","sourceRoot":"","sources":["../../../src/theming.tsx"],"names":[],"mappings":";AAIA,eAAO,MAAQ,aAAa;;IAAE,SAAS;;;;6IAAE,QAAQ,6FACb,CAAC"}

package/lib/typescript/src/utilities.d.ts

@@ -24,3 +24,4 @@ export declare function extractBorderAndMarginStyles(style: StyleProp<any>, addi
  */
 export declare function applyStyles(baseStyles: Array<StyleProp<any>>, stylesToApply: StyleProp<any> | undefined): any;
 export declare function getValueForRadioButton(value: string | number): string;
+//# sourceMappingURL=utilities.d.ts.map

package/lib/typescript/src/utilities.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utilities.d.ts","sourceRoot":"","sources":["../../../src/utilities.ts"],"names":[],"mappings":";AAAA,OAAO,EAAc,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGhE,wBAAgB,aAAa,CAAC,KAAK,EAAE,SAAS,CAAC,GAAG,CAAC;;;EA+BlD;AAED,eAAO,MAAM,gBAAgB,UAwB5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,UAU5B,CAAC;AAEF,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,SAAS,CAAC,GAAG,CAAC,EACrB,sBAAsB,CAAC,EAAE,MAAM,EAAE,EACjC,sBAAsB,CAAC,EAAE,MAAM,EAAE;;;EAqBlC;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,WAAW,CACzB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,EACjC,aAAa,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,SAAS,OAe1C;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,UAQ5D"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "46.4.4-c18fe1.2+c18fe15",
+  "version": "46.4.4-caab07.0+caab0788",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -41,8 +41,7 @@
   "dependencies": {
     "@date-io/date-fns": "^1.3.13",
     "@draftbit/react-theme-provider": "^2.1.1",
-    "@draftbit/types": "^46.4.4-c18fe1.2+c18fe15",
-    "@gorhom/bottom-sheet": "4.4.5",
+    "@draftbit/types": "^46.4.4-alpha.0",
     "@material-ui/core": "^4.11.0",
     "@material-ui/pickers": "^3.2.10",
     "@react-native-community/slider": "4.2.3",
@@ -55,7 +54,6 @@
     "lodash.omit": "^4.5.0",
     "lodash.tonumber": "^4.0.3",
     "react-native-modal-datetime-picker": "^13.0.0",
-    "react-native-scroll-bottom-sheet": "0.7.0",
     "react-native-svg": "12.3.0",
     "react-native-typography": "^1.4.1",
     "react-native-web-swiper": "^2.2.3"
@@ -83,5 +81,5 @@
       ]
     ]
   },
-  "gitHead": "c18fe15af829dd9dbc224859aeda8cc5bda518dc"
+  "gitHead": "caab07883c0d9dd686462e4cf691aa05e52e14b6"
 }

package/src/Provider.js

@@ -2,8 +2,15 @@ import * as React from "react";
 import { ThemeProvider } from "./theming";
 import PortalHost from "./components/Portal/PortalHost";
 export default class Provider extends React.Component {
-    render() {
-        return (React.createElement(PortalHost, null,
-            React.createElement(ThemeProvider, { theme: this.props.theme }, this.props.children)));
-    }
+  render() {
+    return React.createElement(
+      PortalHost,
+      null,
+      React.createElement(
+        ThemeProvider,
+        { theme: this.props.theme },
+        this.props.children
+      )
+    );
+  }
 }

package/src/components/Accordion/AccordionGroup.js

@@ -1,44 +1,88 @@
 import * as React from "react";
-import { View, StyleSheet, Pressable, } from "react-native";
+import { View, StyleSheet, Pressable } from "react-native";
 import Text from "../Text";
 import { withTheme } from "../../theming";
 import { extractStyles } from "../../utilities";
-const AccordionGroup = ({ label, expanded: expandedProp = false, openColor, closedColor, caretColor: caretColorProp, caretSize = 24, icon, iconSize = 24, style, children, theme, Icon, }) => {
-    const [expanded, setExpanded] = React.useState(expandedProp);
-    const { textStyles, viewStyles } = extractStyles(style);
-    const expandedColor = openColor || theme.colors.primary;
-    const collapsedColor = closedColor || theme.colors.primary;
-    const labelColor = expanded ? expandedColor : collapsedColor;
-    const caretColor = caretColorProp || labelColor;
-    const handlePressAction = () => {
-        setExpanded(!expanded);
-    };
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Pressable, { style: [styles.row, viewStyles], onPress: handlePressAction, accessibilityRole: "button" },
-            icon ? (React.createElement(Icon, { name: icon, size: iconSize, color: labelColor, style: styles.icon })) : null,
-            React.createElement(View, { style: styles.content },
-                React.createElement(Text, { selectable: false, style: [
-                        textStyles,
-                        {
-                            color: labelColor,
-                        },
-                    ] }, label)),
-            React.createElement(Icon, { name: expanded
-                    ? "MaterialIcons/keyboard-arrow-up"
-                    : "MaterialIcons/keyboard-arrow-down", color: caretColor, size: caretSize })),
-        expanded ? children : null));
+const AccordionGroup = ({
+  label,
+  expanded: expandedProp = false,
+  openColor,
+  closedColor,
+  caretColor: caretColorProp,
+  caretSize = 24,
+  icon,
+  iconSize = 24,
+  style,
+  children,
+  theme,
+  Icon,
+}) => {
+  const [expanded, setExpanded] = React.useState(expandedProp);
+  const { textStyles, viewStyles } = extractStyles(style);
+  const expandedColor = openColor || theme.colors.primary;
+  const collapsedColor = closedColor || theme.colors.primary;
+  const labelColor = expanded ? expandedColor : collapsedColor;
+  const caretColor = caretColorProp || labelColor;
+  const handlePressAction = () => {
+    setExpanded(!expanded);
+  };
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(
+      Pressable,
+      {
+        style: [styles.row, viewStyles],
+        onPress: handlePressAction,
+        accessibilityRole: "button",
+      },
+      icon
+        ? React.createElement(Icon, {
+            name: icon,
+            size: iconSize,
+            color: labelColor,
+            style: styles.icon,
+          })
+        : null,
+      React.createElement(
+        View,
+        { style: styles.content },
+        React.createElement(
+          Text,
+          {
+            selectable: false,
+            style: [
+              textStyles,
+              {
+                color: labelColor,
+              },
+            ],
+          },
+          label
+        )
+      ),
+      React.createElement(Icon, {
+        name: expanded
+          ? "MaterialIcons/keyboard-arrow-up"
+          : "MaterialIcons/keyboard-arrow-down",
+        color: caretColor,
+        size: caretSize,
+      })
+    ),
+    expanded ? children : null
+  );
 };
 const styles = StyleSheet.create({
-    row: {
-        flexDirection: "row",
-        alignItems: "center",
-    },
-    content: {
-        flex: 1,
-        justifyContent: "center",
-    },
-    icon: {
-        marginRight: 8,
-    },
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+  },
+  content: {
+    flex: 1,
+    justifyContent: "center",
+  },
+  icon: {
+    marginRight: 8,
+  },
 });
 export default withTheme(AccordionGroup);

package/src/components/Accordion/AccordionItem.js

@@ -1,32 +1,59 @@
 import * as React from "react";
-import { Pressable, StyleSheet, View, } from "react-native";
+import { Pressable, StyleSheet, View } from "react-native";
 import Text from "../Text";
 import { extractStyles } from "../../utilities";
 import { withTheme } from "../../theming";
-const AccordionItem = ({ Icon, icon, label, style, iconColor, theme, ...rest }) => {
-    const { textStyles, viewStyles } = extractStyles(style);
-    return (React.createElement(Pressable, { style: [styles.container, viewStyles], ...rest },
-        React.createElement(View, { style: styles.row },
-            icon ? (React.createElement(Icon, { name: icon, size: 24, color: iconColor || theme.colors.primary })) : null,
-            React.createElement(View, { style: [styles.item, styles.content] },
-                React.createElement(Text, { selectable: false, style: textStyles }, label)))));
+const AccordionItem = ({
+  Icon,
+  icon,
+  label,
+  style,
+  iconColor,
+  theme,
+  ...rest
+}) => {
+  const { textStyles, viewStyles } = extractStyles(style);
+  return React.createElement(
+    Pressable,
+    { style: [styles.container, viewStyles], ...rest },
+    React.createElement(
+      View,
+      { style: styles.row },
+      icon
+        ? React.createElement(Icon, {
+            name: icon,
+            size: 24,
+            color: iconColor || theme.colors.primary,
+          })
+        : null,
+      React.createElement(
+        View,
+        { style: [styles.item, styles.content] },
+        React.createElement(
+          Text,
+          { selectable: false, style: textStyles },
+          label
+        )
+      )
+    )
+  );
 };
 const styles = StyleSheet.create({
-    container: {
-        padding: 8,
-    },
-    row: {
-        flexDirection: "row",
-        alignItems: "center",
-        paddingLeft: 8,
-    },
-    item: {
-        marginVertical: 6,
-        paddingLeft: 8,
-    },
-    content: {
-        flex: 1,
-        justifyContent: "center",
-    },
+  container: {
+    padding: 8,
+  },
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingLeft: 8,
+  },
+  item: {
+    marginVertical: 6,
+    paddingLeft: 8,
+  },
+  content: {
+    flex: 1,
+    justifyContent: "center",
+  },
 });
 export default withTheme(AccordionItem);

package/src/components/ActionSheet/ActionSheet.js

@@ -4,42 +4,67 @@ import Portal from "../Portal/Portal";
 import Touchable from "../Touchable";
 import ActionSheetCancel from "./ActionSheetCancel";
 const ActionSheet = ({ visible = false, onClose, children }) => {
-    return visible ? (React.createElement(Portal, null,
-        React.createElement(Touchable, { style: styles.wrapper, onPress: onClose },
-            React.createElement(View, { style: styles.overlay }),
-            React.createElement(View, { style: styles.groupWrapper },
-                React.createElement(View, { style: styles.group }, React.Children.toArray(children).filter((child) => (child === null || child === void 0 ? void 0 : child.type) !== ActionSheetCancel)),
-                React.createElement(View, { style: styles.group }, React.Children.toArray(children).filter((child) => child.type === ActionSheetCancel)))))) : (React.createElement(React.Fragment, null));
+  return visible
+    ? React.createElement(
+        Portal,
+        null,
+        React.createElement(
+          Touchable,
+          { style: styles.wrapper, onPress: onClose },
+          React.createElement(View, { style: styles.overlay }),
+          React.createElement(
+            View,
+            { style: styles.groupWrapper },
+            React.createElement(
+              View,
+              { style: styles.group },
+              React.Children.toArray(children).filter(
+                (child) =>
+                  (child === null || child === void 0 ? void 0 : child.type) !==
+                  ActionSheetCancel
+              )
+            ),
+            React.createElement(
+              View,
+              { style: styles.group },
+              React.Children.toArray(children).filter(
+                (child) => child.type === ActionSheetCancel
+              )
+            )
+          )
+        )
+      )
+    : React.createElement(React.Fragment, null);
 };
 const styles = StyleSheet.create({
-    wrapper: {
-        flex: 1,
-        display: "flex",
-        flexDirection: "column",
-    },
-    overlay: {
-        position: "absolute",
-        top: 0,
-        left: 0,
-        right: 0,
-        bottom: 0,
-        backgroundColor: "#000000",
-        opacity: 0.3,
-    },
-    groupWrapper: {
-        flex: 1,
-        flexDirection: "column",
-        justifyContent: "flex-end",
-        display: "flex",
-        marginBottom: 25,
-    },
-    group: {
-        display: "flex",
-        flexDirection: "column",
-        borderRadius: 10,
-        marginHorizontal: 7,
-        marginVertical: 2.5,
-        overflow: "hidden",
-    },
+  wrapper: {
+    flex: 1,
+    display: "flex",
+    flexDirection: "column",
+  },
+  overlay: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    backgroundColor: "#000000",
+    opacity: 0.3,
+  },
+  groupWrapper: {
+    flex: 1,
+    flexDirection: "column",
+    justifyContent: "flex-end",
+    display: "flex",
+    marginBottom: 25,
+  },
+  group: {
+    display: "flex",
+    flexDirection: "column",
+    borderRadius: 10,
+    marginHorizontal: 7,
+    marginVertical: 2.5,
+    overflow: "hidden",
+  },
 });
 export default ActionSheet;

package/src/components/ActionSheet/ActionSheetCancel.js

@@ -1,6 +1,11 @@
 import React from "react";
 import ActionSheetItem from "./ActionSheetItem";
-const ActionSheetCancel = ({ label = "Cancel", color, style, onPress, }) => {
-    return (React.createElement(ActionSheetItem, { label: label, color: color || "#FF453A", style: [style], onPress: onPress }));
+const ActionSheetCancel = ({ label = "Cancel", color, style, onPress }) => {
+  return React.createElement(ActionSheetItem, {
+    label: label,
+    color: color || "#FF453A",
+    style: [style],
+    onPress: onPress,
+  });
 };
 export default ActionSheetCancel;

package/src/components/ActionSheet/ActionSheetItem.js

@@ -1,30 +1,41 @@
 import React from "react";
-import { Text, StyleSheet, TouchableOpacity, } from "react-native";
+import { Text, StyleSheet, TouchableOpacity } from "react-native";
 import { extractStyles } from "../../utilities";
-const ActionSheetItem = ({ label, style, color, onPress, }) => {
-    const { textStyles, viewStyles } = extractStyles(style);
-    return (React.createElement(TouchableOpacity, { activeOpacity: 0.7, style: [styles.wrapper, viewStyles], onPress: onPress },
-        React.createElement(Text, { style: [styles.label, textStyles, { color }] }, label)));
+const ActionSheetItem = ({ label, style, color, onPress }) => {
+  const { textStyles, viewStyles } = extractStyles(style);
+  return React.createElement(
+    TouchableOpacity,
+    {
+      activeOpacity: 0.7,
+      style: [styles.wrapper, viewStyles],
+      onPress: onPress,
+    },
+    React.createElement(
+      Text,
+      { style: [styles.label, textStyles, { color }] },
+      label
+    )
+  );
 };
 const styles = StyleSheet.create({
-    wrapper: {
-        borderBottomWidth: StyleSheet.hairlineWidth,
-        borderBottomColor: "#CCCCCC",
-        backgroundColor: "#F1F1F1",
-        minHeight: 50,
-        overflow: "hidden",
-        display: "flex",
-        justifyContent: "center",
-    },
-    label: {
-        fontSize: 16,
-        textAlign: "center",
-        color: "#0A84FF",
-        fontWeight: "500",
-        overflow: "hidden",
-        paddingHorizontal: 20,
-        paddingVertical: 10,
-        alignSelf: "center",
-    },
+  wrapper: {
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: "#CCCCCC",
+    backgroundColor: "#F1F1F1",
+    minHeight: 50,
+    overflow: "hidden",
+    display: "flex",
+    justifyContent: "center",
+  },
+  label: {
+    fontSize: 16,
+    textAlign: "center",
+    color: "#0A84FF",
+    fontWeight: "500",
+    overflow: "hidden",
+    paddingHorizontal: 20,
+    paddingVertical: 10,
+    alignSelf: "center",
+  },
 });
 export default ActionSheetItem;

package/src/components/AnimatedCircularProgress.js

@@ -1,43 +1,62 @@
 import * as React from "react";
-import { Animated, Easing, } from "react-native";
+import { Animated, Easing } from "react-native";
 import CircularProgress from "./CircularProgress";
 const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
-const AnimatedCircularProgress = ({ duration = 500, easing = Easing.out(Easing.ease), fill, prefill = 0, useNativeDriver = false, tintColorSecondary, onAnimationComplete, tintColor = "black", ...other }) => {
-    const [fillAnimation] = React.useState(new Animated.Value(prefill));
-    const animate = React.useCallback((toVal = -1, dur, ease) => {
-        const toValue = toVal >= 0 ? toVal : fill;
-        const dura = dur || duration;
-        const eas = ease || easing;
-        const useNative = useNativeDriver;
-        const anim = Animated.timing(fillAnimation, {
-            useNativeDriver: useNative,
-            toValue,
-            easing: eas,
-            duration: dura,
-        });
-        anim.start(onAnimationComplete);
-        return anim;
-    }, [
-        duration,
-        easing,
-        fill,
-        useNativeDriver,
-        fillAnimation,
-        onAnimationComplete,
-    ]);
-    const animateColor = () => {
-        if (!tintColorSecondary) {
-            return tintColor;
-        }
-        const tintAnimation = fillAnimation.interpolate({
-            inputRange: [0, 100],
-            outputRange: [tintColor, tintColorSecondary],
-        });
-        return tintAnimation;
-    };
-    React.useEffect(() => {
-        animate();
-    }, [fill, animate]);
-    return (React.createElement(AnimatedProgress, { ...other, style: other.style, childrenContainerStyle: other.childrenContainerStyle, fill: fillAnimation, tintColor: animateColor() }));
+const AnimatedCircularProgress = ({
+  duration = 500,
+  easing = Easing.out(Easing.ease),
+  fill,
+  prefill = 0,
+  useNativeDriver = false,
+  tintColorSecondary,
+  onAnimationComplete,
+  tintColor = "black",
+  ...other
+}) => {
+  const [fillAnimation] = React.useState(new Animated.Value(prefill));
+  const animate = React.useCallback(
+    (toVal = -1, dur, ease) => {
+      const toValue = toVal >= 0 ? toVal : fill;
+      const dura = dur || duration;
+      const eas = ease || easing;
+      const useNative = useNativeDriver;
+      const anim = Animated.timing(fillAnimation, {
+        useNativeDriver: useNative,
+        toValue,
+        easing: eas,
+        duration: dura,
+      });
+      anim.start(onAnimationComplete);
+      return anim;
+    },
+    [
+      duration,
+      easing,
+      fill,
+      useNativeDriver,
+      fillAnimation,
+      onAnimationComplete,
+    ]
+  );
+  const animateColor = () => {
+    if (!tintColorSecondary) {
+      return tintColor;
+    }
+    const tintAnimation = fillAnimation.interpolate({
+      inputRange: [0, 100],
+      outputRange: [tintColor, tintColorSecondary],
+    });
+    return tintAnimation;
+  };
+  React.useEffect(() => {
+    animate();
+  }, [fill, animate]);
+  return React.createElement(AnimatedProgress, {
+    ...other,
+    style: other.style,
+    childrenContainerStyle: other.childrenContainerStyle,
+    fill: fillAnimation,
+    tintColor: animateColor(),
+  });
 };
 export default AnimatedCircularProgress;

package/src/components/AspectRatio.js

@@ -1,18 +1,26 @@
 import React from "react";
-import { View, StyleSheet, } from "react-native";
+import { View, StyleSheet } from "react-native";
 const AspectRatio = (props) => {
-    const [layout, setLayout] = React.useState(null);
-    const { aspectRatio = 1, ...inputStyle } = StyleSheet.flatten(props.style) || {};
-    const style = [inputStyle, { aspectRatio }];
-    if (layout) {
-        const { width = 0, height = 0 } = layout;
-        if (width === 0) {
-            style.push({ width: height * (1 / aspectRatio), height });
-        }
-        else {
-            style.push({ width, height: width * (1 / aspectRatio) });
-        }
+  const [layout, setLayout] = React.useState(null);
+  const { aspectRatio = 1, ...inputStyle } =
+    StyleSheet.flatten(props.style) || {};
+  const style = [inputStyle, { aspectRatio }];
+  if (layout) {
+    const { width = 0, height = 0 } = layout;
+    if (width === 0) {
+      style.push({ width: height * (1 / aspectRatio), height });
+    } else {
+      style.push({ width, height: width * (1 / aspectRatio) });
     }
-    return (React.createElement(View, { ...props, style: style, onLayout: ({ nativeEvent: { layout: l } }) => setLayout(l) }, props.children));
+  }
+  return React.createElement(
+    View,
+    {
+      ...props,
+      style: style,
+      onLayout: ({ nativeEvent: { layout: l } }) => setLayout(l),
+    },
+    props.children
+  );
 };
 export default AspectRatio;