@draftbit/core 48.5.5-ee2f75.2 → 48.5.6

package/src/deprecated-components/AccordionItem.tsx

@@ -1,77 +1,77 @@
-import * as React from "react";
-import {
-  Pressable,
-  StyleSheet,
-  View,
-  StyleProp,
-  ViewStyle,
-} from "react-native";
-
-import Text from "../components/Text";
-import type { IconSlot } from "../interfaces/Icon";
-import { extractStyles } from "../utilities";
-import { withTheme } from "../theming";
-import type { Theme } from "../styles/DefaultTheme";
-
-type Props = {
-  icon?: string;
-  label: string;
-  iconColor?: string;
-  style?: StyleProp<ViewStyle>;
-  theme: Theme;
-} & IconSlot;
-
-/**
- * @deprecated DEPRECATED: Use direct children with AccordianGroup
- */
-const AccordionItem = ({
-  Icon,
-  icon,
-  label,
-  style,
-  iconColor,
-  theme,
-  ...rest
-}: Props) => {
-  const { textStyles, viewStyles } = extractStyles(style);
-
-  return (
-    <Pressable style={[styles.container, viewStyles]} {...rest}>
-      <View style={styles.row}>
-        {icon ? (
-          <Icon
-            name={icon}
-            size={24}
-            color={iconColor || theme.colors.primary}
-          />
-        ) : null}
-        <View style={[styles.item, styles.content]}>
-          <Text selectable={false} style={textStyles}>
-            {label}
-          </Text>
-        </View>
-      </View>
-    </Pressable>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    padding: 8,
-  },
-  row: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingLeft: 8,
-  },
-  item: {
-    marginVertical: 6,
-    paddingLeft: 8,
-  },
-  content: {
-    flex: 1,
-    justifyContent: "center",
-  },
-});
-
-export default withTheme(AccordionItem);
+import * as React from "react";
+import {
+  Pressable,
+  StyleSheet,
+  View,
+  StyleProp,
+  ViewStyle,
+} from "react-native";
+
+import Text from "../components/Text";
+import type { IconSlot } from "../interfaces/Icon";
+import { extractStyles } from "../utilities";
+import { withTheme } from "../theming";
+import type { Theme } from "../styles/DefaultTheme";
+
+type Props = {
+  icon?: string;
+  label: string;
+  iconColor?: string;
+  style?: StyleProp<ViewStyle>;
+  theme: Theme;
+} & IconSlot;
+
+/**
+ * @deprecated DEPRECATED: Use direct children with AccordianGroup
+ */
+const AccordionItem = ({
+  Icon,
+  icon,
+  label,
+  style,
+  iconColor,
+  theme,
+  ...rest
+}: Props) => {
+  const { textStyles, viewStyles } = extractStyles(style);
+
+  return (
+    <Pressable style={[styles.container, viewStyles]} {...rest}>
+      <View style={styles.row}>
+        {icon ? (
+          <Icon
+            name={icon}
+            size={24}
+            color={iconColor || theme.colors.primary}
+          />
+        ) : null}
+        <View style={[styles.item, styles.content]}>
+          <Text selectable={false} style={textStyles}>
+            {label}
+          </Text>
+        </View>
+      </View>
+    </Pressable>
+  );
+};
+
+const styles = StyleSheet.create({
+  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/deprecated-components/AnimatedCircularProgress.tsx

@@ -1,104 +1,104 @@
-import * as React from "react";
-import {
-  Animated,
-  Easing,
-  EasingFunction,
-  StyleProp,
-  ViewStyle,
-} from "react-native";
-import CircularProgress, {
-  Props as CircularProgressProps,
-} from "./CircularProgress";
-const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
-
-type Props = {
-  duration?: number;
-  easing?: EasingFunction;
-  prefill?: number;
-  useNativeDriver?: boolean;
-  tintColorSecondary?: string;
-  onAnimationComplete?: Animated.EndCallback | undefined;
-} & CircularProgressProps;
-
-/**
- * @deprecated DEPRECATED
- */
-const AnimatedCircularProgress: React.FC<React.PropsWithChildren<Props>> = ({
-  duration = 500,
-  easing = Easing.out(Easing.ease),
-  fill,
-  prefill = 0,
-  useNativeDriver = false,
-  tintColorSecondary,
-  onAnimationComplete,
-  tintColor = "black",
-  ...other
-}) => {
-  const [fillAnimation] = React.useState<Animated.Value>(
-    new Animated.Value(prefill)
-  );
-
-  const animate = React.useCallback(
-    (
-      toVal: number = -1,
-      dur?: number,
-      ease?: EasingFunction
-    ): Animated.CompositeAnimation => {
-      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 (
-    <AnimatedProgress
-      {...other}
-      style={other.style as Animated.WithAnimatedValue<StyleProp<ViewStyle>>}
-      childrenContainerStyle={
-        other.childrenContainerStyle as Animated.WithAnimatedValue<
-          StyleProp<ViewStyle>
-        >
-      }
-      fill={fillAnimation}
-      tintColor={animateColor()}
-    />
-  );
-};
-
-export default AnimatedCircularProgress;
+import * as React from "react";
+import {
+  Animated,
+  Easing,
+  EasingFunction,
+  StyleProp,
+  ViewStyle,
+} from "react-native";
+import CircularProgress, {
+  Props as CircularProgressProps,
+} from "./CircularProgress";
+const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
+
+type Props = {
+  duration?: number;
+  easing?: EasingFunction;
+  prefill?: number;
+  useNativeDriver?: boolean;
+  tintColorSecondary?: string;
+  onAnimationComplete?: Animated.EndCallback | undefined;
+} & CircularProgressProps;
+
+/**
+ * @deprecated DEPRECATED
+ */
+const AnimatedCircularProgress: React.FC<React.PropsWithChildren<Props>> = ({
+  duration = 500,
+  easing = Easing.out(Easing.ease),
+  fill,
+  prefill = 0,
+  useNativeDriver = false,
+  tintColorSecondary,
+  onAnimationComplete,
+  tintColor = "black",
+  ...other
+}) => {
+  const [fillAnimation] = React.useState<Animated.Value>(
+    new Animated.Value(prefill)
+  );
+
+  const animate = React.useCallback(
+    (
+      toVal: number = -1,
+      dur?: number,
+      ease?: EasingFunction
+    ): Animated.CompositeAnimation => {
+      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 (
+    <AnimatedProgress
+      {...other}
+      style={other.style as Animated.WithAnimatedValue<StyleProp<ViewStyle>>}
+      childrenContainerStyle={
+        other.childrenContainerStyle as Animated.WithAnimatedValue<
+          StyleProp<ViewStyle>
+        >
+      }
+      fill={fillAnimation}
+      tintColor={animateColor()}
+    />
+  );
+};
+
+export default AnimatedCircularProgress;

package/src/deprecated-components/AvatarEdit.tsx

@@ -1,67 +1,67 @@
-import * as React from "react";
-import { View, ImageSourcePropType, StyleProp, ViewStyle } from "react-native";
-import Touchable from "../components/Touchable";
-import CircleImage from "./CircleImage";
-import { withTheme } from "../theming";
-
-import type { Theme } from "../styles/DefaultTheme";
-import type { IconSlot } from "../interfaces/Icon";
-
-type Props = {
-  image: string | ImageSourcePropType;
-  size?: number;
-  onPress?: () => void;
-  style?: StyleProp<ViewStyle>;
-  theme: Theme;
-} & IconSlot;
-
-/**
- * @deprecated DEPRECATED
- */
-const AvatarEdit: React.FC<React.PropsWithChildren<Props>> = ({
-  Icon,
-  image,
-  size = 80,
-  onPress = () => {},
-  style,
-  theme,
-  ...rest
-}) => {
-  const colorStyles = {
-    editBackgroundColor: theme.colors.primary,
-    editIconColor: theme.colors.surface,
-    editBorderColor: theme.colors.surface,
-  };
-
-  const dimensions = {
-    width: size,
-    height: size,
-  };
-
-  return (
-    <View style={[style, dimensions]} {...rest}>
-      <Touchable onPress={onPress}>
-        <CircleImage source={image} size={size} />
-        <View
-          style={{
-            position: "absolute",
-            top: -3,
-            right: -3,
-            borderColor: colorStyles.editBorderColor,
-            backgroundColor: colorStyles.editBackgroundColor,
-            borderRadius: size * (3 / 16),
-            padding: size * (3 / 32),
-          }}
-        >
-          <Icon
-            name="MaterialIcons/edit"
-            color={colorStyles.editIconColor}
-            size={size * (3 / 16)}
-          />
-        </View>
-      </Touchable>
-    </View>
-  );
-};
-
-export default withTheme(AvatarEdit);
+import * as React from "react";
+import { View, ImageSourcePropType, StyleProp, ViewStyle } from "react-native";
+import Touchable from "../components/Touchable";
+import CircleImage from "./CircleImage";
+import { withTheme } from "../theming";
+
+import type { Theme } from "../styles/DefaultTheme";
+import type { IconSlot } from "../interfaces/Icon";
+
+type Props = {
+  image: string | ImageSourcePropType;
+  size?: number;
+  onPress?: () => void;
+  style?: StyleProp<ViewStyle>;
+  theme: Theme;
+} & IconSlot;
+
+/**
+ * @deprecated DEPRECATED
+ */
+const AvatarEdit: React.FC<React.PropsWithChildren<Props>> = ({
+  Icon,
+  image,
+  size = 80,
+  onPress = () => {},
+  style,
+  theme,
+  ...rest
+}) => {
+  const colorStyles = {
+    editBackgroundColor: theme.colors.primary,
+    editIconColor: theme.colors.surface,
+    editBorderColor: theme.colors.surface,
+  };
+
+  const dimensions = {
+    width: size,
+    height: size,
+  };
+
+  return (
+    <View style={[style, dimensions]} {...rest}>
+      <Touchable onPress={onPress}>
+        <CircleImage source={image} size={size} />
+        <View
+          style={{
+            position: "absolute",
+            top: -3,
+            right: -3,
+            borderColor: colorStyles.editBorderColor,
+            backgroundColor: colorStyles.editBackgroundColor,
+            borderRadius: size * (3 / 16),
+            padding: size * (3 / 32),
+          }}
+        >
+          <Icon
+            name="MaterialIcons/edit"
+            color={colorStyles.editIconColor}
+            size={size * (3 / 16)}
+          />
+        </View>
+      </Touchable>
+    </View>
+  );
+};
+
+export default withTheme(AvatarEdit);