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

package/src/components/DeprecatedFAB.js

@@ -1,160 +1,115 @@
 import * as React from "react";
-import { ActivityIndicator, View, StyleSheet } from "react-native";
+import { ActivityIndicator, View, StyleSheet, } from "react-native";
 import color from "color";
 import Config from "./Config";
 import Text from "./Text";
 import Touchable from "./Touchable";
 import Elevation from "./Elevation";
 import { withTheme } from "../theming";
-const FAB = ({
-  Icon,
-  icon,
-  disabled = false,
-  type = "solid",
-  loading = false,
-  color: colorOverride,
-  label,
-  onPress,
-  elevation = 0,
-  style,
-  theme: { colors, disabledOpacity, roundness, typography },
-  ...rest
-}) => {
-  let backgroundColor, borderColor, textColor, borderWidth;
-  const buttonColor = colorOverride || colors.primary;
-  if (type === "standard" || type === "extended" || type === "fixed") {
-    backgroundColor = buttonColor;
-    if (disabled) {
-      textColor = color(colors.surface).alpha(disabledOpacity).rgb().string();
-    } else {
-      textColor = colors.surface;
+const FAB = ({ Icon, icon, disabled = false, type = "solid", loading = false, color: colorOverride, label, onPress, elevation = 0, style, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
+    let backgroundColor, borderColor, textColor, borderWidth;
+    const buttonColor = colorOverride || colors.primary;
+    if (type === "standard" || type === "extended" || type === "fixed") {
+        backgroundColor = buttonColor;
+        if (disabled) {
+            textColor = color(colors.surface).alpha(disabledOpacity).rgb().string();
+        }
+        else {
+            textColor = colors.surface;
+        }
     }
-  } else {
-    backgroundColor = "transparent";
-    if (disabled) {
-      textColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
-    } else {
-      textColor = buttonColor;
+    else {
+        backgroundColor = "transparent";
+        if (disabled) {
+            textColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
+        }
+        else {
+            textColor = buttonColor;
+        }
     }
-  }
-  if (type === "outline") {
-    if (disabled) {
-      borderColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
-    } else {
-      borderColor = buttonColor;
+    if (type === "outline") {
+        if (disabled) {
+            borderColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
+        }
+        else {
+            borderColor = buttonColor;
+        }
+        borderWidth = StyleSheet.hairlineWidth;
     }
-    borderWidth = StyleSheet.hairlineWidth;
-  } else {
-    borderColor = "transparent";
-    borderWidth = 0;
-  }
-  const buttonStyle = {
-    backgroundColor,
-    borderColor,
-    borderWidth,
-    borderRadius: roundness,
-    alignItems: "center",
-    justifyContent: "center",
-  };
-  const buttonStyles = [styles.button, buttonStyle];
-  const contentStyle = [styles.content];
-  const textStyle = {
-    textAlign: "center",
-    color: textColor,
-  };
-  const iconStyle = [
-    styles.icon,
-    {
-      width: Config.buttonIconSize,
-    },
-  ];
-  if (type === "standard" || type === "outline") {
-    buttonStyle.width = Config.FABSize;
-    buttonStyle.height = Config.FABSize;
-    buttonStyle.borderRadius = Config.FABBorderRadius;
-    contentStyle.push({
-      width: Config.FABSize,
-      height: Config.FABSize,
-    });
-  }
-  if (type === "extended" || type === "fixed") {
-    iconStyle.push({
-      marginLeft: 16,
-      marginRight: -8,
-    });
-    textStyle.margin = 16;
-  }
-  if (type === "fixed") {
-    buttonStyles.push({
-      height: Config.FABFixedHeight,
-      alignSelf: "stretch",
-    });
-  }
-  return React.createElement(
-    Elevation,
-    { style: [{ elevation }, style] },
-    React.createElement(
-      Touchable,
-      {
-        ...rest,
-        onPress: onPress,
-        accessibilityState: { disabled },
-        accessibilityRole: "button",
-        disabled: disabled || loading,
-        style: buttonStyles,
-      },
-      React.createElement(
-        View,
-        { style: styles.content },
-        icon && loading !== true
-          ? React.createElement(
-              View,
-              { style: iconStyle },
-              React.createElement(Icon, {
-                name: icon,
-                size: Config.buttonIconSize,
-                color: textColor,
-              })
-            )
-          : null,
-        loading
-          ? React.createElement(ActivityIndicator, {
-              size: "small",
-              color: textColor,
-              style: iconStyle,
-            })
-          : null,
-        label
-          ? React.createElement(
-              Text,
-              { numberOfLines: 1, style: [textStyle, typography.button] },
-              label
-            )
-          : null
-      )
-    )
-  );
+    else {
+        borderColor = "transparent";
+        borderWidth = 0;
+    }
+    const buttonStyle = {
+        backgroundColor,
+        borderColor,
+        borderWidth,
+        borderRadius: roundness,
+        alignItems: "center",
+        justifyContent: "center",
+    };
+    const buttonStyles = [styles.button, buttonStyle];
+    const contentStyle = [styles.content];
+    const textStyle = {
+        textAlign: "center",
+        color: textColor,
+    };
+    const iconStyle = [
+        styles.icon,
+        {
+            width: Config.buttonIconSize,
+        },
+    ];
+    if (type === "standard" || type === "outline") {
+        buttonStyle.width = Config.FABSize;
+        buttonStyle.height = Config.FABSize;
+        buttonStyle.borderRadius = Config.FABBorderRadius;
+        contentStyle.push({
+            width: Config.FABSize,
+            height: Config.FABSize,
+        });
+    }
+    if (type === "extended" || type === "fixed") {
+        iconStyle.push({
+            marginLeft: 16,
+            marginRight: -8,
+        });
+        textStyle.margin = 16;
+    }
+    if (type === "fixed") {
+        buttonStyles.push({
+            height: Config.FABFixedHeight,
+            alignSelf: "stretch",
+        });
+    }
+    return (React.createElement(Elevation, { style: [{ elevation }, style] },
+        React.createElement(Touchable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: buttonStyles },
+            React.createElement(View, { style: styles.content },
+                icon && loading !== true ? (React.createElement(View, { style: iconStyle },
+                    React.createElement(Icon, { name: icon, size: Config.buttonIconSize, color: textColor }))) : null,
+                loading ? (React.createElement(ActivityIndicator, { size: "small", color: textColor, style: iconStyle })) : null,
+                label ? (React.createElement(Text, { numberOfLines: 1, style: [textStyle, typography.button] }, label)) : null))));
 };
 const styles = StyleSheet.create({
-  button: {
-    borderStyle: "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,
-  },
+    button: {
+        borderStyle: "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/src/components/Divider.js

@@ -2,15 +2,12 @@ import * as React from "react";
 import { StyleSheet, View } from "react-native";
 import { withTheme } from "../theming";
 const Divider = ({ style, color, theme: { colors }, ...rest }) => {
-  return React.createElement(View, {
-    style: [
-      {
-        backgroundColor: color || colors.divider,
-        height: StyleSheet.hairlineWidth,
-      },
-      style,
-    ],
-    ...rest,
-  });
+    return (React.createElement(View, { style: [
+            {
+                backgroundColor: color || colors.divider,
+                height: StyleSheet.hairlineWidth,
+            },
+            style,
+        ], ...rest }));
 };
 export default withTheme(Divider);

package/src/components/Elevation.js

@@ -1,31 +1,20 @@
 import * as React from "react";
-import { Animated, StyleSheet, View } from "react-native";
+import { Animated, StyleSheet, View, } from "react-native";
 import shadow from "../styles/shadow";
 import { withTheme } from "../theming";
 /* directly copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx#L62 */
 const Elevation = ({ style, theme, children, ...rest }) => {
-  const { elevation = 4, borderRadius: radius } =
-    StyleSheet.flatten(style) || {};
-  const { colors } = theme;
-  const borderRadius = radius;
-  return React.createElement(
-    Animated.View,
-    {
-      ...rest,
-      style: [
-        {
-          borderRadius,
-          backgroundColor: colors.surface,
-        },
-        elevation ? shadow(elevation) : null,
-        style,
-      ],
-    },
-    React.createElement(
-      View,
-      { style: { overflow: "hidden", borderRadius } },
-      children
-    )
-  );
+    const { elevation = 4, borderRadius: radius } = StyleSheet.flatten(style) || {};
+    const { colors } = theme;
+    const borderRadius = radius;
+    return (React.createElement(Animated.View, { ...rest, style: [
+            {
+                borderRadius,
+                backgroundColor: colors.surface,
+            },
+            elevation ? shadow(elevation) : null,
+            style,
+        ] },
+        React.createElement(View, { style: { overflow: "hidden", borderRadius } }, children)));
 };
 export default withTheme(Elevation);

package/src/components/FAB.js

@@ -1,92 +1,46 @@
 import * as React from "react";
-import {
-  View,
-  StyleSheet,
-  Pressable,
-  ActivityIndicator,
-  Platform,
-} from "react-native";
+import { View, StyleSheet, Pressable, ActivityIndicator, Platform, } from "react-native";
 import { withTheme } from "../theming";
-const FAB = ({
-  onPress,
-  disabled,
-  loading,
-  iconName = "MaterialIcons/add",
-  style,
-  theme,
-  iconColor,
-  bgColor,
-  size = 50,
-  Icon,
-  ...props
-}) => {
-  const backgroundColor = bgColor || theme.colors.primary;
-  const color = iconColor || "#FFF";
-  return React.createElement(
-    View,
-    {
-      style: [
-        {
-          width: size,
-          height: size,
-          borderRadius: size / 2,
-          overflow: "hidden",
-        },
-        style,
-      ],
-    },
-    React.createElement(
-      Pressable,
-      {
-        onPress: onPress,
-        disabled: loading || disabled,
-        android_ripple: {
-          color: "#333",
-          radius: size / 4,
-        },
-        style: ({ pressed }) => {
-          return [
-            styles.button,
+const FAB = ({ onPress, disabled, loading, iconName = "MaterialIcons/add", style, theme, iconColor, bgColor, size = 50, Icon, ...props }) => {
+    const backgroundColor = bgColor || theme.colors.primary;
+    const color = iconColor || "#FFF";
+    return (React.createElement(View, { style: [
             {
-              opacity: pressed || disabled ? 0.75 : 1,
-              width: size,
-              height: size,
-              borderRadius: size / 2,
-              backgroundColor,
+                width: size,
+                height: size,
+                borderRadius: size / 2,
+                overflow: "hidden",
             },
-          ];
-        },
-        ...props,
-      },
-      React.createElement(
-        View,
-        null,
-        loading
-          ? React.createElement(ActivityIndicator, {
-              style: size > 50 ? { marginTop: 2, marginLeft: 2 } : undefined,
-              size: size <= 50 ? "small" : "large",
-              color: color,
-            })
-          : React.createElement(Icon, {
-              name: iconName,
-              size: size,
-              color: color,
-            })
-      )
-    )
-  );
+            style,
+        ] },
+        React.createElement(Pressable, { onPress: onPress, disabled: loading || disabled, android_ripple: {
+                color: "#333",
+                radius: size / 4,
+            }, style: ({ pressed }) => {
+                return [
+                    styles.button,
+                    {
+                        opacity: pressed || disabled ? 0.75 : 1,
+                        width: size,
+                        height: size,
+                        borderRadius: size / 2,
+                        backgroundColor,
+                    },
+                ];
+            }, ...props },
+            React.createElement(View, null, loading ? (React.createElement(ActivityIndicator, { style: size > 50 ? { marginTop: 2, marginLeft: 2 } : undefined, size: size <= 50 ? "small" : "large", color: color })) : (React.createElement(Icon, { name: iconName, size: size, color: color }))))));
 };
 const styles = StyleSheet.create({
-  button: {
-    backgroundColor: "#5a45ff",
-    justifyContent: "center",
-    alignItems: "center",
-    ...Platform.select({
-      web: {
-        cursor: "pointer",
-        userSelect: "none",
-      },
-    }),
-  },
+    button: {
+        backgroundColor: "#5a45ff",
+        justifyContent: "center",
+        alignItems: "center",
+        ...Platform.select({
+            web: {
+                cursor: "pointer",
+                userSelect: "none",
+            },
+        }),
+    },
 });
 export default withTheme(FAB);

package/src/components/FieldSearchBarFull.js

@@ -1,90 +1,53 @@
 import * as React from "react";
-import { View, TextInput, StyleSheet } from "react-native";
+import { View, TextInput, StyleSheet, } from "react-native";
 import { withTheme } from "../theming";
 import Config from "./Config";
-const FieldSearchBarFull = ({
-  showIcon,
-  Icon,
-  icon = "search",
-  placeholder = "",
-  style,
-  theme: { colors, typography },
-  onChange: changeOverride,
-  onSubmit: submitOverride,
-  value,
-  defaultValue,
-}) => {
-  const [focused, setIsFocused] = React.useState(false);
-  const onBlur = () => {
-    setIsFocused(false);
-  };
-  const [internalValue, setInternalValue] = React.useState(
-    value || defaultValue
-  );
-  React.useEffect(() => {
-    if (value != null) {
-      setInternalValue(value);
-    }
-  }, [value]);
-  React.useEffect(() => {
-    if (defaultValue != null) {
-      setInternalValue(defaultValue);
-    }
-  }, [defaultValue]);
-  const onChange = React.useCallback(
-    (text) => {
-      changeOverride && changeOverride(text);
-    },
-    [changeOverride]
-  );
-  const onFocus = () => {
-    setIsFocused(true);
-  };
-  const onSubmit = (e) => {
-    submitOverride && submitOverride(e);
-  };
-  const { lineHeight, ...typeStyles } = typography.body2; // eslint-disable-line @typescript-eslint/no-unused-vars
-  const handleChangeText = (newValue) => {
-    setInternalValue(newValue);
-    if (onChange) {
-      onChange(newValue);
-    }
-  };
-  return React.createElement(
-    View,
-    { style: [styles.container, style] },
-    showIcon &&
-      React.createElement(Icon, {
-        name: icon,
-        size: Config.fieldSearchBarFullIconSize,
-        color: focused ? colors.primary : colors.light,
-      }),
-    React.createElement(
-      View,
-      { style: { marginLeft: showIcon ? 12 : 0, flex: 1 } },
-      React.createElement(TextInput, {
-        clearButtonMode: "while-editing",
-        placeholder: placeholder,
-        value: internalValue,
-        onBlur: onBlur,
-        onFocus: onFocus,
-        onChangeText: handleChangeText,
-        onSubmitEditing: onSubmit,
-        placeholderTextColor: colors.light,
-        style: [
-          {
-            color: colors.medium,
-          },
-          typeStyles,
-        ],
-      })
-    )
-  );
+const FieldSearchBarFull = ({ showIcon, Icon, icon = "search", placeholder = "", style, theme: { colors, typography }, onChange: changeOverride, onSubmit: submitOverride, value, defaultValue, }) => {
+    const [focused, setIsFocused] = React.useState(false);
+    const onBlur = () => {
+        setIsFocused(false);
+    };
+    const [internalValue, setInternalValue] = React.useState(value || defaultValue);
+    React.useEffect(() => {
+        if (value != null) {
+            setInternalValue(value);
+        }
+    }, [value]);
+    React.useEffect(() => {
+        if (defaultValue != null) {
+            setInternalValue(defaultValue);
+        }
+    }, [defaultValue]);
+    const onChange = React.useCallback((text) => {
+        changeOverride && changeOverride(text);
+    }, [changeOverride]);
+    const onFocus = () => {
+        setIsFocused(true);
+    };
+    const onSubmit = (e) => {
+        submitOverride && submitOverride(e);
+    };
+    const { lineHeight, ...typeStyles } = typography.body2; // eslint-disable-line @typescript-eslint/no-unused-vars
+    const handleChangeText = (newValue) => {
+        setInternalValue(newValue);
+        if (onChange) {
+            onChange(newValue);
+        }
+    };
+    return (React.createElement(View, { style: [styles.container, style] },
+        showIcon && (React.createElement(Icon, { name: icon, size: Config.fieldSearchBarFullIconSize, color: focused ? colors.primary : colors.light })),
+        React.createElement(View, { style: { marginLeft: showIcon ? 12 : 0, flex: 1 } },
+            React.createElement(TextInput, { clearButtonMode: "while-editing", placeholder: placeholder, value: internalValue, onBlur: onBlur, onFocus: onFocus, onChangeText: handleChangeText, onSubmitEditing: onSubmit, placeholderTextColor: colors.light, style: [
+                    {
+                        color: colors.medium,
+                    },
+                    typeStyles,
+                ] }))));
 };
 const styles = StyleSheet.create({
-  container: {
-    flexDirection: "row",
-    alignItems: "center",
-  },
+    container: {
+        flexDirection: "row",
+        alignItems: "center",
+    },
 });
 export default withTheme(FieldSearchBarFull);

package/src/components/FormRow.js

@@ -2,34 +2,18 @@ import * as React from "react";
 import { Text, StyleSheet } from "react-native";
 import { extractStyles } from "../utilities";
 import Touchable from "./Touchable";
-export default function FormRow({
-  disabled,
-  direction,
-  children,
-  label,
-  style,
-  onPress,
-  ...rest
-}) {
-  const { textStyles, viewStyles } = extractStyles(style);
-  return React.createElement(
-    Touchable,
-    {
-      disabled: disabled,
-      onPress: onPress,
-      style: [styles.row, { flexDirection: direction }, viewStyles],
-      ...rest,
-    },
-    React.createElement(Text, { style: textStyles }, label),
-    children
-  );
+export default function FormRow({ disabled, direction, children, label, style, onPress, ...rest }) {
+    const { textStyles, viewStyles } = extractStyles(style);
+    return (React.createElement(Touchable, { disabled: disabled, onPress: onPress, style: [styles.row, { flexDirection: direction }, viewStyles], ...rest },
+        React.createElement(Text, { style: textStyles }, label),
+        children));
 }
 const styles = StyleSheet.create({
-  row: {
-    marginLeft: 8,
-    marginRight: 8,
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-  },
+    row: {
+        marginLeft: 8,
+        marginRight: 8,
+        flexDirection: "row",
+        justifyContent: "space-between",
+        alignItems: "center",
+    },
 });