// Metro module 1826 (f1827).
import { useMemo } from "react";
import { Animated, View, StyleSheet } from "react-native";
import { useKeyboardState } from "./useResizeMode";
const r31 = {
  width: 13,
  height: 2,
  borderRadius: 1
};
const arrowUpContainer = {
  marginHorizontal: 5,
  width: 30,
  height: 30,
  justifyContent: "center",
  alignItems: "center"
};
const styles = StyleSheet.create({
  arrowUpContainer,
  arrowDownContainer: {
    ...arrowUpContainer,
    transform: [{
      rotate: "180deg"
    }]
  },
  arrow: {
    width: 20,
    height: 20,
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "space-between"
  },
  arrowLeftLine: {
    ...r31,
    transform: [{
      rotate: "-45deg"
    }],
    left: -0.5
  },
  arrowRightLine: {
    ...r31,
    transform: [{
      rotate: "45deg"
    }],
    left: -5.5
  }
});
export default ({ type, disabled, theme }) => {
  let memo;
  memo = void 0;
  const keyboardState = useKeyboardState((a0) => a0.appearance);
  memo = useMemo(() => {
    const r4 = theme[keyboardState];
    return {
      backgroundColor: disabled ? r4.disabled : r4.primary
    };
  }, [disabled, theme, keyboardState]);
  return <View style={type === "next" ? styles.arrowDownContainer : styles.arrowUpContainer}>
    <View style={styles.arrow}>
      <Animated.View style={useMemo(() => [styles.arrowLeftLine, memo], [memo])} />
      <Animated.View style={useMemo(() => [styles.arrowRightLine, memo], [memo])} />
    </View>
  </View>;
};