// Metro module 11434 (f11435).
import { memo } from "react";
import { StyleSheet } from "react-native";
import { CONTROLS_DRAWER_HEADER_SIZE } from "./VoicePanelControlsConstants";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { useSharedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
import NativeView from "../../../core/native/NativeView";
import VoicePanelHeaderGlassBlur from "../shared/VoicePanelHeaderGlassBlur";
import ReanimatedNativeView from "../../../core/native/ReanimatedNativeView";
import { Text } from "../../../../design/components/Text/native/Text";
const useStyles = createStyles({
  titleWrapper: {
    position: "absolute",
    top: 0,
    left: 0,
    right: 0,
    justifyContent: "center",
    alignItems: "center",
    padding: 16,
    height: CONTROLS_DRAWER_HEADER_SIZE
  },
  titlePill: {
    borderRadius: Module712.radii.round,
    paddingHorizontal: 12,
    paddingTop: 1,
    paddingBottom: 2
  },
  titlePillBG: {
    backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH
  }
});
const __initData = {
  code: "function VoicePanelControlsDrawerTitleTsx1(){const{shown,_shown,disablePill,backgroundColor}=this.__closure;const showBGColor=shown!=null?shown.get():_shown.get();return{backgroundColor:showBGColor&&!disablePill?backgroundColor:'transparent'};}"
};
const r44 = memo(function VoicePanelControlsDrawerTitle(props) {
  const title = props.title;
  let shown2 = props.shown;
  const shown = shown2;
  let disablePill = props.disablePill;
  if (disablePill === void 0) {
    disablePill = false;
  }
  let c18833_1 = disablePill;
  const { style, blurStyle } = props;
  const styles = useStyles();
  const sharedValue = useSharedValue(true);
  const backgroundColor = styles.titlePillBG.backgroundColor;
  const r26 = function() {
    return {
      backgroundColor: (shown != null ? shown.get() : sharedValue.get()) ? c18833_1 ? "transparent" : backgroundColor : "transparent"
    };
  };
  r26.__closure = {
    shown,
    _shown: sharedValue,
    disablePill,
    backgroundColor
  };
  r26.__workletHash = 14837285839887;
  r26.__initData = __initData;
  const animatedStyle = useAnimatedStyle(r26);
  if (shown == null) {
    shown2 = sharedValue;
  }
  return <NativeView style={[styles.titleWrapper, style]}>
    <VoicePanelHeaderGlassBlur shown={shown2} style={StyleSheet.absoluteFillObject} blurStyle={blurStyle} />
    <ReanimatedNativeView style={[styles.titlePill, animatedStyle]}>
      <Text variant="redesign/heading-18/bold" color="mobile-text-heading-primary" accessibilityRole="header">{title}</Text>
    </ReanimatedNativeView>
  </NativeView>;
});
export default r44;