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

package/src/components/ToggleButton.js

@@ -2,38 +2,63 @@ import * as React from "react";
 import { withTheme } from "../theming";
 import { StyleSheet } from "react-native";
 import IconButton from "./IconButton";
-const ToggleButton = ({ Icon, icon, toggled = false, onPress = () => { }, defaultValue, disabled = false, color = "primary", colorSecondary = "surface", borderColor = "divider", iconSize = 25, width = 50, height = 50, theme: { colors }, style, ...rest }) => {
-    const [internalValue, setInternalValue] = React.useState(toggled || defaultValue || false);
-    React.useEffect(() => {
-        if (toggled != null) {
-            setInternalValue(toggled);
-        }
-    }, [toggled]);
-    React.useEffect(() => {
-        if (defaultValue != null) {
-            setInternalValue(defaultValue);
-        }
-    }, [defaultValue]);
-    const handlePress = () => {
-        setInternalValue(!internalValue);
-        onPress(!internalValue);
-    };
-    return (React.createElement(IconButton, { Icon: Icon, icon: icon, size: iconSize, color: internalValue ? colors[color] : colors[colorSecondary], onPress: handlePress, disabled: disabled, style: [
-            styles.mainContainer,
-            {
-                width,
-                height,
-                backgroundColor: internalValue
-                    ? colors[colorSecondary]
-                    : colors[color],
-                borderColor: colors[borderColor],
-            },
-            style,
-        ], ...rest }));
+const ToggleButton = ({
+  Icon,
+  icon,
+  toggled = false,
+  onPress = () => {},
+  defaultValue,
+  disabled = false,
+  color = "primary",
+  colorSecondary = "surface",
+  borderColor = "divider",
+  iconSize = 25,
+  width = 50,
+  height = 50,
+  theme: { colors },
+  style,
+  ...rest
+}) => {
+  const [internalValue, setInternalValue] = React.useState(
+    toggled || defaultValue || false
+  );
+  React.useEffect(() => {
+    if (toggled != null) {
+      setInternalValue(toggled);
+    }
+  }, [toggled]);
+  React.useEffect(() => {
+    if (defaultValue != null) {
+      setInternalValue(defaultValue);
+    }
+  }, [defaultValue]);
+  const handlePress = () => {
+    setInternalValue(!internalValue);
+    onPress(!internalValue);
+  };
+  return React.createElement(IconButton, {
+    Icon: Icon,
+    icon: icon,
+    size: iconSize,
+    color: internalValue ? colors[color] : colors[colorSecondary],
+    onPress: handlePress,
+    disabled: disabled,
+    style: [
+      styles.mainContainer,
+      {
+        width,
+        height,
+        backgroundColor: internalValue ? colors[colorSecondary] : colors[color],
+        borderColor: colors[borderColor],
+      },
+      style,
+    ],
+    ...rest,
+  });
 };
 const styles = StyleSheet.create({
-    mainContainer: {
-        borderWidth: 1,
-    },
+  mainContainer: {
+    borderWidth: 1,
+  },
 });
 export default withTheme(ToggleButton);

package/src/components/Touchable.js

@@ -1,12 +1,28 @@
 import React from "react";
 import { Pressable } from "react-native";
-export default function Touchable({ children, disabled, onPress, style, ...props }) {
-    return (React.createElement(Pressable, { onPress: onPress, disabled: disabled, hitSlop: 8, style: ({ pressed }) => {
-            return [
-                {
-                    opacity: pressed || disabled ? 0.75 : 1,
-                },
-                style,
-            ];
-        }, ...props }, children));
+export default function Touchable({
+  children,
+  disabled,
+  onPress,
+  style,
+  ...props
+}) {
+  return React.createElement(
+    Pressable,
+    {
+      onPress: onPress,
+      disabled: disabled,
+      hitSlop: 8,
+      style: ({ pressed }) => {
+        return [
+          {
+            opacity: pressed || disabled ? 0.75 : 1,
+          },
+          style,
+        ];
+      },
+      ...props,
+    },
+    children
+  );
 }

package/src/components/Typography.js

@@ -2,35 +2,53 @@ import React from "react";
 import { Text } from "react-native";
 import { withTheme } from "../theming";
 export const Title = withTheme(({ text, theme, style }) => {
-    return (React.createElement(Text, { style: [
-            {
-                fontSize: 20,
-                letterSpacing: 0,
-                lineHeight: 26,
-                color: theme.colors.text,
-            },
-            style,
-        ] }, text));
+  return React.createElement(
+    Text,
+    {
+      style: [
+        {
+          fontSize: 20,
+          letterSpacing: 0,
+          lineHeight: 26,
+          color: theme.colors.text,
+        },
+        style,
+      ],
+    },
+    text
+  );
 });
 export const Subtitle = withTheme(({ text, theme, style }) => {
-    return (React.createElement(Text, { style: [
-            {
-                fontSize: 14,
-                letterSpacing: 0,
-                lineHeight: 16,
-                color: theme.colors.medium,
-            },
-            style,
-        ] }, text));
+  return React.createElement(
+    Text,
+    {
+      style: [
+        {
+          fontSize: 14,
+          letterSpacing: 0,
+          lineHeight: 16,
+          color: theme.colors.medium,
+        },
+        style,
+      ],
+    },
+    text
+  );
 });
 export const Caption = withTheme(({ text, theme, style }) => {
-    return (React.createElement(Text, { style: [
-            {
-                fontSize: 12,
-                letterSpacing: 0,
-                lineHeight: 14,
-                color: theme.colors.light,
-            },
-            style,
-        ] }, text));
+  return React.createElement(
+    Text,
+    {
+      style: [
+        {
+          fontSize: 12,
+          letterSpacing: 0,
+          lineHeight: 14,
+          color: theme.colors.light,
+        },
+        style,
+      ],
+    },
+    text
+  );
 });

package/src/components/useAuthState.js

@@ -1,31 +1,31 @@
 import * as React from "react";
 export const useAuthState = (auth) => {
-    const [error, setError] = React.useState();
-    const [value, setValue] = React.useState(auth.currentUser);
-    React.useEffect(() => {
-        const list = auth.onAuthStateChanged(setValue, setError);
-        return () => {
-            list();
-        };
-    }, [auth]);
-    const signInWithEmailAndPassword = (user, password) => {
-        auth
-            .signInWithEmailAndPassword(user, password)
-            .then(setValue)
-            .catch(setError);
+  const [error, setError] = React.useState();
+  const [value, setValue] = React.useState(auth.currentUser);
+  React.useEffect(() => {
+    const list = auth.onAuthStateChanged(setValue, setError);
+    return () => {
+      list();
     };
-    const createUserWithEmailAndPassword = (user, password) => {
-        auth
-            .signInWithEmailAndPassword(user, password)
-            .then(setValue)
-            .catch(setError);
-    };
-    const signOut = () => auth.signOut();
-    return [
-        value,
-        error,
-        signInWithEmailAndPassword,
-        signOut,
-        createUserWithEmailAndPassword,
-    ];
+  }, [auth]);
+  const signInWithEmailAndPassword = (user, password) => {
+    auth
+      .signInWithEmailAndPassword(user, password)
+      .then(setValue)
+      .catch(setError);
+  };
+  const createUserWithEmailAndPassword = (user, password) => {
+    auth
+      .signInWithEmailAndPassword(user, password)
+      .then(setValue)
+      .catch(setError);
+  };
+  const signOut = () => auth.signOut();
+  return [
+    value,
+    error,
+    signInWithEmailAndPassword,
+    signOut,
+    createUserWithEmailAndPassword,
+  ];
 };

package/src/constants.js

@@ -1,10 +1,12 @@
 import { Platform } from "react-native";
 // @ts-ignore
 const expo = global.__expo;
-const DEFAULT_STATUSBAR_HEIGHT_EXPO = (expo === null || expo === void 0 ? void 0 : expo.Constants)
-    ? expo.Constants.statusBarHeight
-    : 0;
+const DEFAULT_STATUSBAR_HEIGHT_EXPO = (
+  expo === null || expo === void 0 ? void 0 : expo.Constants
+)
+  ? expo.Constants.statusBarHeight
+  : 0;
 export const APPROX_STATUSBAR_HEIGHT = Platform.select({
-    android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
-    ios: Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0,
+  android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
+  ios: Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0,
 });

package/src/hooks.js

@@ -1,12 +1,12 @@
 import React from "react";
 export 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.useRef();
-    // Store current value in ref
-    React.useEffect(() => {
-        ref.current = value;
-    }, [value]);
-    // Return previous value (happens before update in useEffect above)
-    return ref.current;
+  // 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.useRef();
+  // Store current value in ref
+  React.useEffect(() => {
+    ref.current = value;
+  }, [value]);
+  // Return previous value (happens before update in useEffect above)
+  return ref.current;
 }

package/src/index.js

@@ -27,11 +27,26 @@ export { default as TextField } from "./components/TextField";
 export { default as ToggleButton } from "./components/ToggleButton";
 export { default as Touchable } from "./components/Touchable";
 export { AccordionGroup, AccordionItem } from "./components/Accordion";
-export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
+export {
+  ActionSheet,
+  ActionSheetItem,
+  ActionSheetCancel,
+} from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
-export { BottomSheet } from "./components/BottomSheet";
-export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
-export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
+export {
+  Center,
+  Circle,
+  Square,
+  Row,
+  Stack,
+  Spacer,
+} from "./components/Layout";
+export {
+  RadioButton,
+  RadioButtonGroup,
+  RadioButtonRow,
+  RadioButtonFieldGroup,
+} from "./components/RadioButton/index";
 /* Deprecated: Fix or Delete!  */
 export { default as CardBlock } from "./components/CardBlock";
 export { default as CardContainer } from "./components/CardContainer";

package/src/index.tsx

@@ -34,7 +34,6 @@ export {
   ActionSheetCancel,
 } from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
-export { BottomSheet } from "./components/BottomSheet";
 
 export {
   Center,

package/src/interfaces/Icon.js

@@ -5,4 +5,5 @@
  * `@draftbit/ui`.
  */
 import React from "react";
-export const injectIcon = (Component, Icon) => (props) => React.createElement(Component, { ...props, Icon });
+export const injectIcon = (Component, Icon) => (props) =>
+  React.createElement(Component, { ...props, Icon });

package/src/mappings/Accordion.js

@@ -1,41 +1,49 @@
-import { COMPONENT_TYPES, createNumberProp, createIconProp, createTextProp, createStaticBoolProp, createColorProp, } from "@draftbit/types";
+import {
+  COMPONENT_TYPES,
+  createNumberProp,
+  createIconProp,
+  createTextProp,
+  createStaticBoolProp,
+  createColorProp,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Accordion",
-    tag: "AccordionGroup",
-    description: "An expandable container containing components",
-    category: COMPONENT_TYPES.container,
-    layout: {
-        paddingTop: 8,
-        paddingRight: 8,
-        paddingBottom: 8,
-        paddingLeft: 8,
-        fontSize: 16,
-    },
-    props: {
-        label: createTextProp({
-            label: "Label",
-        }),
-        expanded: createStaticBoolProp({
-            label: "Expanded",
-            description: "Whether the AccordionGroup should be initaially expanded or not",
-        }),
-        openColor: createColorProp({
-            label: "Open text color",
-        }),
-        closedColor: createColorProp({
-            label: "Closed text color",
-        }),
-        caretColor: createColorProp({
-            label: "Caret color",
-        }),
-        caretSize: createNumberProp({
-            label: "Caret size",
-            defaultValue: 24,
-        }),
-        icon: createIconProp(),
-        iconSize: createNumberProp({
-            label: "Icon size",
-            defaultValue: 24,
-        }),
-    },
+  name: "Accordion",
+  tag: "AccordionGroup",
+  description: "An expandable container containing components",
+  category: COMPONENT_TYPES.container,
+  layout: {
+    paddingTop: 8,
+    paddingRight: 8,
+    paddingBottom: 8,
+    paddingLeft: 8,
+    fontSize: 16,
+  },
+  props: {
+    label: createTextProp({
+      label: "Label",
+    }),
+    expanded: createStaticBoolProp({
+      label: "Expanded",
+      description:
+        "Whether the AccordionGroup should be initaially expanded or not",
+    }),
+    openColor: createColorProp({
+      label: "Open text color",
+    }),
+    closedColor: createColorProp({
+      label: "Closed text color",
+    }),
+    caretColor: createColorProp({
+      label: "Caret color",
+    }),
+    caretSize: createNumberProp({
+      label: "Caret size",
+      defaultValue: 24,
+    }),
+    icon: createIconProp(),
+    iconSize: createNumberProp({
+      label: "Icon size",
+      defaultValue: 24,
+    }),
+  },
 };

package/src/mappings/AccordionItem.js

@@ -1,16 +1,21 @@
-import { COMPONENT_TYPES, createIconProp, createTextProp, createColorProp, } from "@draftbit/types";
+import {
+  COMPONENT_TYPES,
+  createIconProp,
+  createTextProp,
+  createColorProp,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Accordion Item",
-    tag: "AccordionItem",
-    description: "Item to be used in Accordion",
-    category: COMPONENT_TYPES.deprecated,
-    props: {
-        icon: createIconProp(),
-        label: createTextProp({
-            label: "Item label",
-        }),
-        iconColor: createColorProp({
-            label: "Icon color",
-        }),
-    },
+  name: "Accordion Item",
+  tag: "AccordionItem",
+  description: "Item to be used in Accordion",
+  category: COMPONENT_TYPES.deprecated,
+  props: {
+    icon: createIconProp(),
+    label: createTextProp({
+      label: "Item label",
+    }),
+    iconColor: createColorProp({
+      label: "Icon color",
+    }),
+  },
 };

package/src/mappings/ActionSheet.js

@@ -1,13 +1,13 @@
 import { COMPONENT_TYPES, createStaticBoolProp, GROUPS } from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Action Sheet",
-    tag: "ActionSheet",
-    description: "Action Sheet container",
-    category: COMPONENT_TYPES.actionsheet,
-    props: {
-        visible: createStaticBoolProp({
-            group: GROUPS.data,
-            label: "Show Action Sheet",
-        }),
-    },
+  name: "Action Sheet",
+  tag: "ActionSheet",
+  description: "Action Sheet container",
+  category: COMPONENT_TYPES.actionsheet,
+  props: {
+    visible: createStaticBoolProp({
+      group: GROUPS.data,
+      label: "Show Action Sheet",
+    }),
+  },
 };

package/src/mappings/ActionSheetCancel.js

@@ -1,19 +1,26 @@
-import { COMPONENT_TYPES, createActionProp, createColorProp, createTextProp, GROUPS, Triggers, } from "@draftbit/types";
+import {
+  COMPONENT_TYPES,
+  createActionProp,
+  createColorProp,
+  createTextProp,
+  GROUPS,
+  Triggers,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Action Sheet Cancel",
-    tag: "ActionSheetCancel",
-    description: "Action Sheet cancel",
-    category: COMPONENT_TYPES.actionsheet,
-    triggers: [Triggers.OnPress],
-    props: {
-        onPress: createActionProp(),
-        label: createTextProp({
-            group: GROUPS.basic,
-            label: "Label",
-            defaultValue: "Cancel",
-        }),
-        color: createColorProp({
-            label: "Font Color",
-        }),
-    },
+  name: "Action Sheet Cancel",
+  tag: "ActionSheetCancel",
+  description: "Action Sheet cancel",
+  category: COMPONENT_TYPES.actionsheet,
+  triggers: [Triggers.OnPress],
+  props: {
+    onPress: createActionProp(),
+    label: createTextProp({
+      group: GROUPS.basic,
+      label: "Label",
+      defaultValue: "Cancel",
+    }),
+    color: createColorProp({
+      label: "Font Color",
+    }),
+  },
 };

package/src/mappings/ActionSheetItem.js

@@ -1,23 +1,30 @@
-import { COMPONENT_TYPES, createActionProp, createColorProp, createTextProp, GROUPS, Triggers, } from "@draftbit/types";
+import {
+  COMPONENT_TYPES,
+  createActionProp,
+  createColorProp,
+  createTextProp,
+  GROUPS,
+  Triggers,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Action Sheet Item",
-    tag: "ActionSheetItem",
-    description: "Action Sheet item",
-    category: COMPONENT_TYPES.actionsheet,
-    triggers: [Triggers.OnPress],
-    layout: {
-        textAlign: "center",
-    },
-    props: {
-        onPress: createActionProp(),
-        label: createTextProp({
-            group: GROUPS.basic,
-            label: "Label",
-            defaultValue: "Option",
-        }),
-        color: createColorProp({
-            label: "Font Color",
-            defaultValue: "strong",
-        }),
-    },
+  name: "Action Sheet Item",
+  tag: "ActionSheetItem",
+  description: "Action Sheet item",
+  category: COMPONENT_TYPES.actionsheet,
+  triggers: [Triggers.OnPress],
+  layout: {
+    textAlign: "center",
+  },
+  props: {
+    onPress: createActionProp(),
+    label: createTextProp({
+      group: GROUPS.basic,
+      label: "Label",
+      defaultValue: "Option",
+    }),
+    color: createColorProp({
+      label: "Font Color",
+      defaultValue: "strong",
+    }),
+  },
 };