1/**
2 * Copyright (c) 650 Industries.
3 * Copyright (c) Meta Platforms, Inc. and affiliates.
4 *
5 * This source code is licensed under the MIT license found in the
6 * LICENSE file in the root directory of this source tree.
7 */
8import React, { useState } from 'react';
9import { GestureResponderEvent, Insets, Platform, Pressable, View, ViewStyle } from 'react-native';
10
11import * as LogBoxStyle from './LogBoxStyle';
12
13type Props = {
14  backgroundColor: {
15    default: string;
16    pressed: string;
17  };
18  children?: any;
19  hitSlop?: Insets;
20  onPress?: ((event: GestureResponderEvent) => void) | null;
21  style?: ViewStyle;
22};
23
24export function LogBoxButton(props: Props) {
25  const [pressed, setPressed] = useState(false);
26
27  let backgroundColor = props.backgroundColor;
28  if (!backgroundColor) {
29    backgroundColor = {
30      default: LogBoxStyle.getBackgroundColor(0.95),
31      pressed: LogBoxStyle.getBackgroundColor(0.6),
32    };
33  }
34
35  const content = (
36    <View
37      style={[
38        {
39          backgroundColor: pressed ? backgroundColor.pressed : backgroundColor.default,
40          ...Platform.select({
41            web: {
42              cursor: 'pointer',
43            },
44          }),
45        },
46        props.style,
47      ]}>
48      {props.children}
49    </View>
50  );
51
52  return props.onPress == null ? (
53    content
54  ) : (
55    <Pressable
56      hitSlop={props.hitSlop}
57      onPress={props.onPress}
58      onPressIn={() => setPressed(true)}
59      onPressOut={() => setPressed(false)}>
60      {content}
61    </Pressable>
62  );
63}
64